0202 - HTML自学笔记

div / span 的不同

div是块元素(block-level elements):

0202 - HTML自学笔记_第1张图片

上图为一个div元素的实例。

我们可以看出,块元素div是以新行开始的,并且通过div我们可以将几个元素(如h和p)连起来使其成为一个整体,这个整体拥有相同的样式(背景颜色,字体颜色,间距等)。

Thedivelement is often used as a container for other HTML elements.

span是内联元素 (inline elements):

0202 - HTML自学笔记_第2张图片

内联元素span的实例。

在行内生效。可以对段内的某一部分文本的格式进行编辑。不换行。

Thespanelement is often used as a container for some text.

class 与 id 的不同

class规定元素一个或多个类名。规定多个类时,用空格分隔类名。

0202 - HTML自学笔记_第3张图片

id规定元素唯一的id。

0202 - HTML自学笔记_第4张图片

p 与 br 的不同

p是段落,br是换行(回车)。p元素中可以嵌套br。

0202 - HTML自学笔记_第5张图片

如何使用 table 排版

使用HTML table元素定义一个表格

使用HTML tr元素定义表格的一行

使用HTML td元素定义表格的一个单元格

使用HTML th元素定义表格的表头

使用HTML caption元素定义表格的标题

使用CSS border property to define a border

使用CSS border-collapse property to collapse cell borders

使用CSS padding property to add padding to cells

使用CSS text-align property to align cell text

使用CSS border-spacing property to set the spacing between cells

使用colspan参数让单元格横跨多行

使用rowspan参数让单元格横跨多列

0202 - HTML自学笔记_第6张图片

============================================================

参考:

块(div与span)

http://www.w3school.com.cn/html/html_blocks.asp

http://www.w3schools.com/html/html_blocks.asp

table

http://www.w3school.com.cn/html/html_tables.asp

http://www.w3schools.com/html/html_tables.asp

你可能感兴趣的:(0202 - HTML自学笔记)