HTML5⽂字变化和排版技巧
⽂字变化和排版技巧
1.1段落效果——使⽤排版标签
1.1.1设置段落样式的标签
在HTML中利⽤<p>标签来区分段落，换⾏可以⽤<br>标签完成。
1.<p>标签
<p>标签是成对的标签，将<p>置于段落起始初，</p>置于段尾，这样不但具有分段功能还具有设置段落居中或靠右对齐的功能。
语法：
<p>...</p>
2.<br>标签
功能：换⾏，⽆结尾标签，也⽆属性。
语法：
第⼀⾏<br/>第⼆⾏（加不加”/”都可以，但是在HTML5中有不成⽂的规定：单⼀标签必须加上）
1.1.2设置对齐与缩进标签
1.<pre></pre>标签
<pre>可以让⽂字按照原始代码的排列⽅式进⾏显⽰。
2.<blockquote></blockquote>标签
⽤来表⽰引⽤⽂字，会将标记内的⽂字换⾏并缩进。
1.1.3 添加分隔线
可以让画⾯更容易区分主题或段落。
<hr>标签
作⽤是添加分隔线。在HTML4中<hr>标签有改变外观的属性，如size、color等，H5中不再⽀持，可以使⽤CSS实现。
1.1.4 设置段落标题
<h1>,<h2>,<h3>,<h4>,<h5>,<h6>这6个标签是设置段落标题的⼤⼩级别，<h1>字体最⼤，<h6>最⼩。由<h1>~<h2>标签标识的⽂字将会独占⼀⾏。H5不再⽀持align 属性，align 属性：规定 div 元素中的内容的⽔平对齐⽅式。
1.2⽂字效果——使⽤⽂字标记
1.2.1设置字形样式的标记
1.<font>标签（HTML5已停⽤）
主要⽤来设置⽂字的字号、颜⾊和字体，⽤法如下：
<font size=”2” color=”#FF0000”face=”楷体”>
属性如下：
属性设置值说明
size 相对值（size=+2）
绝对值（size=2）
设置⽂字⼤⼩，默认值为size=3
color 颜⾊名称（color=”read”）
HEX码（color=”#FF0000”）
设置⽂字颜⾊
face系统内置字形设置⽂字字体
face 当⽤户的计算机没有设置的字体时，浏览器会⾃动以系统内置字形进⾏显⽰。
size 相对值的意思是以0为基础，每加1则字体放⼤⼀级，最⼤到”+4”，每减1则字体缩⼩1级，最⼩到”-2”。
2.<b>,<u>,<i>标签
这些都必须有结束标签。可以嵌套使⽤。如：
<u><i><b>...</b></i></u>
<b>是将⽂字设置为粗体。
<i>是将⽂字设置为斜体。
<u>是将为⽂字添加下划线。
基本上，H5不建议使⽤这些标签，最好使⽤CSS语法代替:
<b> ——>font-weight
<i> ——>font-style
<u> ——>font-decoration
1.2.2 设置上表、下标
<sup>,<sub>标签
分别⽤于将⽂字设置为上标和下标，通常⽤于⽅程式或公式。如：
SO<sub>4</sub><sup>2+</sup>
显⽰结果为：
SO42+
1.3项⽬符号与编程——使⽤列表标签
1.3.1 符号列表（⼜称 ⽆序列表 Unordered list）
⽤法：
<ul>,<li>标签
<ul>
<li>...</li>
<li>...</li>
</ul>
<ul type=””> 属性： disc（实体圆），circle（空⼼圆），square（⽅块）H5不建议使⽤
1.3.2 编号列表（有序列表 Ordered list）
<ol> 功能是将⽂字段落向内缩进，并在段落的每个项⽬前加上1，2，3。。。有顺序的数字。如：
<ol type=”i”start=”3”></ol>
属性设置值说明
Type设置值有5种设置数⽬样式，默认值：type=1
start1,2,3等整数值设置编号起始值，默认值：start=1
reversed reversed反向排序，数字改为由⼤到⼩（IE9不⽀持）
有序⽆序列表可以嵌套创建：
<ul>
html中的5种空格表示<ol>
</ol>
<ol>
</ol>
</ul>
1.3.3 定义列表
适⽤于有主题与内容的两段⽂字，通常第⼀段以<dt>标签定义主题，第⼆段以<dd>标签来定义内容。
<dl> 标签定义了定义列表（definition list）
<dl> 标签⽤于结合  （定义列表中的项⽬）和  （描述列表中的项⽬）
如：
<dl>
<dt>
Google
<dd>Google（中⽂名：⾕歌），是⼀家的跨国科技企业，致⼒于互联⽹搜索、、等领域，开发并提供⼤量基于的产品与服务，其主要利润来⾃于等⼴告服务。Google由当时在攻读理⼯博⼠的和谢尔盖·布卢姆共同创建，因此两⼈也被称为“Google Guys”。
</dl>
1.4 注释与特殊符号
1.4.1 添加注释
格式：
<!--注释⽂字-->
使⽤HTML5注释加⼊条件，就可以让IE浏览器根据注释内容进⾏条件判断，⽽其他浏览器则只会当作普通HTML注释进⾏处理。IE条件建议放在<head>与</head>内。语法：
<!--[ifIE]>只有IE会执⾏此语句<![endif]-->
上述代码是让注释标记的语句只有在IE才能执⾏。IE注释内还可以加⼊⼀些命令来限制IE版本，如lt（lower than）表⽰更旧的版本，语法：
<!--[iflt IE 9]>IE 9 以下的版本会执⾏次语句<!endif--]-->
上述代码只有IE6-IE8的版本才会执⾏。可以使⽤JavaScript来弥补IE9⼀下版本不能浏览H5的问题。
<!--[iflit IE 9]>
<![endif]-->
1.4.2 使⽤特殊符号
特殊符号HTML表⽰法
©©
< <
> >
“"
&&
半⾓空格 
在HTML⽂件中按⼏次键盘空格键，在⽹页上浏览时，都只会显⽰⼀个空格的距离。
如果希望显⽰多个空格，就使⽤多个” ”符号。例如要显⽰:
<u>BeautifulWorld</u>
HTML需要：
<u>BeautifulWorld</u>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。