HTML-4.1-排版标签

一：注释标签

<!-- 注释 -->

二：段落标签

• <p>
• 属性
  • align=“属性值”：对齐方式
    • left, center, right

<!-- 段落标签 -->
<p>左边</p>
<p align="center">中间</p>
<p align="right"></p>

三：HTML标签

1、文本级标签

• p, span, a, b, i, u, em
• 文本级标签只能放文字、图片、表单元素（a标签里不能放a和input）

2、容器级标签

• div, h系列, li, dt, dd
• 容器级标签里可以放置任何东西

四：块级标签

1、<div>

• div的语义是division“分割”
  • 把标签中的内容作为一个块来对待（division），必须独占一行
• align=“属性值”：设置块儿的位置
  • left, right, center
• div中的所有元素是一个小区域，是一个容器级标签
  • 里面什么都能放
• 纯粹使用<div>标签而不加任何css内容，其效果与用<p>标签一样
  • 当把css放进<div>标签以后，可以指定HTML的元素显示在屏幕上的具体位置
  • 可以在某一位置上画出方形或线，或者指定文字在某一块中如何显示

2、<span>

• span的语义是span“范围、跨度”
  • 不换行
• span也是表达小区域、小跨度的标签，是一个文本级标签
  • span里面只能放置文字、图片、表单元素
  • 不能放p, h, ul, dl, ol, div
• 给一段内容加上<span></span>标签可以通过在<span>标签上定义样式来设定其内容的样式

我是<span style="color: red">中国人</span>。

3、<div>和<span>特点

• 都没有对元素内的对象进行任何格式化渲染
• 主要用于应用样式表

4、<div>和<span>区别

• <div>标签是块元素
• <span>标签是行内元素

五：换行标签

• <br>
  • 强制的换行
• <p>和<br>的区别
  • <p>标签：会在段落的前后自动插入一个空行
  • <br>标签：没有空行，而且<br>标签没有属性

六：水平线标签

• <hr>
• 属性
  • align=“属性值”：设定线条置放位置
    • 默认居中
    • left, right, center
  • size=“2”：设定线条粗细，以像素为单位
  • width="500"或width=“70%”：设定线条长度
    • 可以是绝对值（单位是像素）或相对值
    • 如果设置为绝对值的话，内定为100%
  • color=“red”：设置线条颜色
  • noshade：不要阴影，即设定线条为平面显示
    • 若没有这个属性则表明线条阴影或立体，这是内定值

	<p>水平线标签</p>
	<hr size="1" color="red" width="50%" align="left">

七：内容居中标签

• <center>
• 此时center代表的是一个标签而不是一个属性
• 只要在这个标签里面的内容，都会居于浏览器的中间

	<p>内容居中标签</p>
	<center style="color:red">这是内容居中标签</center>

八：预定义（预格式化）标签

• <pre>
• 将保留其中的所有的空白字符（空格、换行符），原封不动的输出结果
• 主要用于PHP打印一个数组时使用

	<p>预定义（预格式化）标签</p>
	<pre>        我是中国人     我爱中国
    中国心
	</pre>