《个人学习笔记五》
字体font标记
在不指定任何样式的情况下，IE浏览器会把字体显示为3号、黑色、宋体。因此设计网页时，根据需要更改不同段落的字体。HTML5中可以试用CSS中的字体属性代替。
1.基本语法
< font face="" size="" color="" >…< /font>
2.属性说明
font标记的属性、值及其说明
属性 | 值 | 说明 |
size | +1~+7 ， 1~7 ， -1~-7 | 正数字越大字号越大，负数字越大字越小 |
color | rgb（r，g，b） 如果不（r%，g%，b%）#rrggbb或#rgb colorname | 规定文本的颜色。可以试使用rgb函数、十六进制、颜色英文名称来表示 |
face | 字体1,，字体2，字体3…字体n | face属性可以有多个值，用逗号隔开。字体使用方式我从左到右依次选用。如果前面字体不存在，则使用后面一个字体。若都不存在，则默认使用“宋体” |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<font face="黑体" size="-1" color="#000fff">-1字</font>
<font face="黑体" size="-3" color="#000fff">-3字</font>
<font face="黑体" size="-5" color="#000fff">-5字</font>
<font face="黑体" size="-7" color="#000fff">-7字</font>
<br>
<font face="宋体" size="2" color="#ff0066">2字</font>
<font face="宋体" size="4" color="#ff0066">4字</font>
<font face="宋体" size="6" color="#ff0066">6字</font>
<br>
<font face="黑体" size="+1" color="#ff0066">1字</font>
<font face="黑体" size="+3" color="#ff0066">2字</font>
<font face="黑体" size="+5" color="#ff0066">5字</font>
<font face="黑体" size="+7" color="#ff0066">7字</font>
</body>
</html>显示结果：
段落与排版标记
段落p标记
段落p标记用来开始一个段落，它是一个块级标记，该标记中不能再包含其他的任何块级元素。
换行br标记（行内元素不会自动换行，需要用换行标记）
水平分割线hr标记（用一条水平线将页面按功能用途进行分割）
< hr>标记的属性及说明
属性 | 说明 |
width | 设置水平线宽度 |
size | 设置水平线高度 |
color | 设置水平线高度 |
align | 设置水平线对齐方式 |
拼音/音标注释ruby标记&rt/rp标记
ruby标记定义ruby注释（中文注音或字符）。ruby与rt一同使用。ruby标记由一个或多个字符（需要一个解释/发音）和一个提供信息的rt标记组成，和包括可选的rp标记，定义当浏览器不支持ruby标记时显示的内容。
ruby标记用它将需要注释或注音的文字内容包裹住。
rt标记这里放置音标或注释，这个标纪要放在需要注释的文本后面。
rp标记是为了防备那些不支持ruby的浏览器，主要用来放置括号。对于支持这个标记的浏览器，rp标记的CSS样式{display：none；}，也就是不可见。
预格式化pre标记
在HTML中会利用成对的< pre>< /pre>标记对网页上文字段落进行格式化，浏览器会完整保留设计者在源文件中定义的格式，包括各种空格、缩进以及其他特殊格式。
练习事例代码及结果：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<p>这是一段话，中间省略100个字</p>
<p align="left">这是一段话，中间省略100个字</p>
<p align="center">这是一段话，中间省略100个字</p>
<p align="right">这是一段话，中间省略100个字</p>
</div>
<hr color="blue">
<br>
<div><br> 这是一段话，中间我想断开一下<br>然后我在继续</div>
<hr color="yellow">
<p>分割线</p>
<hr color="red" width="600px" size="5" align="right">
<p>分割线</p>
</div>
<div>
<ruby>
中<rp>(</rp><rt>zhong</rt><rp>)</rp>
国<rp>(</rp><rt>guo</rt><rp>)</rp>
人<rt>ren</rt>
民<rt>min</rt>
</ruby>
</div>
<hr color="green">
<div>
<pre>
春晓
孟浩然
春眠不觉晓，
处处闻啼鸟。
夜来风雨声，
花落知多少。
</pre> </div>
</body>
</html>