列表、图片、表格和链接

2017-06-28 本文已影响0人 hyt222

<ul></ul> unordered list 不排序的列表，在每一项的前面不会列出数字，用小圆点代替。

<li></li> list item 列表的每一项。

<ol><ol> ordered list 有序列表。有一个属性 start=-1 , 可以让列表序号从 -1 开始。

list 本身的特性造成列表项目前有 Table 的效果，在源文件中也做出这种效果，为了文件更加好读。

无论是 unordered list 还是 ordered list ，他们可以嵌套。

还有一种 <dl></dl> definition list 类似字典，词条与解释

<dt></dt> 词条 <dd></dd>解释

chrome浏览器效果

<img /> 单个标记，没有结束标记。需要用属性 src 告诉它图片在哪里。

属性 width 可指定，height 也可指定。width 和height 主要作用是为了让浏览器预先给你的图片留下位置。

属性 alt = "01" 假如图片装载不过来或正在装载过程中，可以先给你看 alt 属性的文字。

我们要理解一件事情：对于 HTML 来说，图片是一个字符。一定要从这个高度去理解图片在 HTML 里的位置。作为一个字符，意味着它和前后的字符其实是连在一起的，一个个从左往右排过来的。

如果你觉得图片太大放在页面不合适，应该用图片编辑软件把图片缩小再放到页面中。

如果想把某个网站的图片放到我们的页面中，右键点击网站图片“复制图片地址”，src 为复制的地址。src 可用的三种格式：jpg，gif，png。其它格式看浏览器。

在 HTML 5 ，通过 CSS 决定图片和周围文字之间关系。

chrome浏览器显示效果

<a></a> 在中间放的文字（图片）是出现在我们页面上的链接。

<a href="http://news.163.com">网易新闻</a> herf 属性为链接目的地。

属性 target = _blank 打开一个新的窗口载入目的地链接。

链接在浏览器的显示由CSS决定（无CSS则由浏览器默认样式决定）。鼠标放置链接处，浏览器左下角状态栏显示链接目的地址。

如果 href 里的地址没有协议名称开头（http ftp mailto），浏览器会认为你想要的是你这个 html 页面所在的目录里有另外一个文件或目录。

如果要链接到别的地方去一定要加上协议名称，才能找到相应的地方。如果没有协议名称打开当前目录下html页面。

段落 <p> 有一种属性 id 。id = "here" 给这个段落起了名字 here 。<a href="#here"> 我们可以说目的地是一个段落，用这种方式可以在一个页面里再设定目的地。

<a href="you.html#here"> 可转移到其他页面的 here。

HTML 里绝大多数用来表达结构的标记都可以有 id 属性，标题 h1、h2 也可称为目的地。

在图像上建立映射（地图）。

chrome浏览器显示

<table border="1"></table> 表格，border 属性画格子线。HTML 会根据表格数据做自动计算，自动调整表格。

<caption></caption> 表格名称

thead tbody tfoot 把表格分为三部分，表头、内容、脚注。

<tr></tr> 表示一行 th 表头内容 td 格子内容

td 的属性 clospan rowspan 列扩展行扩展