html/css: 基础知识

HTML 指的是超文本标记语言 (HyperText Markup Language)

HTML 被设计用来显示数据。

 

<!DOCTYPE html>

<html>

<title>Title</title>

<body>这里写代码片

<!-- This is an example -->

<h1>My First Heading</h1>

<br />

<p>My first paragraph.</p>

<hr /> 

</body>

</html>


HTML 文档是由 HTML 元素定义的:

HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

<!DOCTYPE> 定义文档类型。

<html> 元素定义了整个 HTML 文档。

<title>定义文档的标题。

<body> 元素定义了 HTML 文档的主体。

<hN> 元素定义标题,N为1-6个级别。

<p> 元素定义了 HTML 文档中的一个段落。

<br /> 就是没有关闭标签的空元素,定义换行。

<hr /> 标签在 HTML 页面中创建水平线

<!-- This is a comment --> 用来注释


HTML 标签可以拥有属性:

属性总是以名称/值对的形式出现。

属性总是在 HTML 元素的开始标签中规定。


可以使用notepad或记事本写html:

当您保存 HTML 文件时,既可以使用 .htm 也可以使用 .html 扩展名。


HTML 链接是通过 <a> 标签进行定义的:

<a href="url">Link text</a>

使用图像做链接:

<a href="url"><img border="0" src="x.gif" /></a>

在新窗口打开链接:

<a href="url" target="_blank">Link text</a>

跳到命名处:

<a name="tips">yourtips</a><a href="#tips">Link text</a>


HTML 图像是通过 <img> 标签进行定义的:

<img src="url" />

图像无法加载的替换文本:

<img src="url" alt="replace text">

背景图片:

<body background="url">

调整图像大小:

<img src="url" width="n" height="m">

排列图片:

<img src="url" align="bottom/left/right/top">


外部样式表:

<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>

内部样式:

<head><style type="text/css">body {background-color: red}p {margin-left: 20px}</style></head>

内联样式:

<p style="color: red; margin-left: 20px">This is a paragraph</p>


表格: 

<table> </table>  标签来定义表格

<tr> </tr> 标签定义一行 

<td> cell text </td> 定义单元格 

带边框的表格:

<table border="N"> N为1-n表示边框大小

带表头:

<th>Heading</th>

空单元格:

<td>&nbsp;</td>


无序列表:

<ul>

<li>name1</li>

<li>name2</li>

</ul>

有序列表:N表示起始序号

<ol start="N">

<li>name1</li>

<li>name2</li>

</ol>

自定义列表:

<dl>

<dt>name1</dt>

<dd>tips1</dd>

<dt>name2</dt>

<dd>tips2</dd>

</dl>


################################################################################

CSS :层叠样式表 (CascadingStyleSheets)

 

CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明:

每条声明由一个属性和一个值组成,属性和值被冒号分开。

selector {

    declaration1: value1;

    declaration2: value2;

     ...

    declarationN: valueN

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值