3、文档设置标记上-格式标记(主要内容标记<br><p><center><pre><li><ul><ol><dl><dt><dd><hr><div>)
<br>
强制换行标记:让后面的文字、图片、表格等等,显示在下一行。例:
<html> <head> <title>测试</title> <meta charset=”UTF-8”> </head> <body> HTML!<br/>超文本标记语言! </body> </html>
<p>
换段落标记:换段落,由于多个空格和回车在HTML中会被等效为一个 空格,所以HTML中要换段落就要用<p>,<p>段落中也可以包含 <p>段落!例:
<html> <head> <title>p标签示例</title> <meta charset=”UTF-8”> </head> <body> <p> 换段落标记:换段落,由于多个空格和回车在HTML中会被等效为一个 空格,所以HTML中要换段落就要用<p>,<p>段落中也可以包含 <p>段落! </p> <p> 换段落标记:换段落,由于多个空格和回车在HTML中会被等效为一个 空格,所以HTML中要换段落就要用<p>,<p>段落中也可以包含 <p>段落! </p> </body> </html>
<center>
居中对齐标记:让段落或者是文字相对于父标记居中显示。例:
<html> <head> <title>center标签示例</title> <meta charset=”UTF-8”> </head> <body> <p> <center>居中对齐标记:让段落或者是文字相对于父标记居中显示</center> </p> </body> </html>
<pre>
预格式化标记:保留预先编排好的格式。例:
<html> <head> <title>pre标签示例</title> <meta charset=”UTF-8”> </head> <body> <p>预格式化标记: 保留预先编排好的格式</p> <p> <pre>预格式化标记: 保留预先编排好的格式</pre> </p> </body> </html>
<li>
列表项目标记:每一个列表使用一个<li>标记。例:
<html> <head> <title>第三节课</title> <meta charset="UTF-8"> </head> <body> <ul> <li>第一节课</li> <li>第二节课</li> <li>第三节课</li> <li>第四节课</li> <li>第五节课</li> </ul> </body> </html>
<ul>
无序列表标记:<ul>声明这个列表没有序号
<ol>
有序列表标记:可以显示特定的一些顺序。
格式如下:
<ol type="符号类型">
<li type="符号类型"></li>
<li type="符号类型"></li>
</ol>
例1:
<html> <head> <title>第三节课</title> <meta charset="UTF-8"> </head> <body> <ol> <li>第一节课</li> <li>第二节课</li> <li>第三节课</li> <li>第四节课</li> <li>第五节课</li> </ol> <ol type="I"> <li>第一节课</li> <li>第二节课</li> <li>第三节课</li> <li>第四节课</li> <li>第五节课</li> </ol> <ol type="A"> <li>第一节课</li> <li>第二节课</li> <li>第三节课</li> <li>第四节课</li> <li>第五节课</li> </ol> </body> </html>
图示:
有序列表的type属性值
①:1
阿拉伯数字1.2.3等等,默认type属性值
②:A
大小字母A、B、C等等
③:a
小写字母a、b、c等等
④:Ⅰ
大写罗马数字Ⅰ、Ⅱ、Ⅲ、Ⅳ等等
⑤:ⅰ
小写罗马数字ⅰ、ⅱ、ⅲ、ⅳ等等
<dl><dt><dd>
定义型列表:对列表条目进行简短的说明。
格式如下:
<html> <head> <title>第三节课</title> <meta charset="UTF-8"> </head> <body> <dl> <dt>软件说明:</dt> <dd>简单介绍软件的功能及基本应用</dd> <dt>软件界面:</dt> <dd>用于选择软件的外观</dd> </dl> </body> </html>
<hr>
水平分割线标记:段落之间的分割线。例:
<html> <head> <title>第三节课</title> <meta charset="UTF-8"> </head> <body> 水平分割线标记:段落之间的分割线! <hr> 水平分割线标记:段落之间的分割线! </body> </html>
<div>
分区显示标记,也称之为层标记:常用来编排一大段的HTML段落,也可以用于格式化表,和<p>很相似,层可以多层嵌套使用。例:
<html> <head> <title>第三节课</title> <meta charset=”UTF-8”> </head> <body> <div> 分区显示标记,也称之为层标记 <hr> 分区显示标记,也称之为层标记 </div> <div> 分区显示标记,也称之为层标记 <hr> 分区显示标记,也称之为层标记 </div> </body> </html>
4、文档设置标记下-文本标记(主要内容标记<hn><font><b><i><sub><sup><tt><cite><em><strong>
<small><big><u>)
文本标记分类
1.hn---标题标记:共有6个级别,n的范围1~6,不同级别对应显示大小不同的标题,h1最大,h6最小
2.font---字体设置标记:设置字体的格式
三个常用属性
1.size(字体大小)
<font size="14px">
2.color(颜色)
<font color="red">
3.face(字体)
<font face="微软雅黑">
3.b---粗字体标记
4.i---斜字体标记
5.sub---文字下标字体标记
6.sup---文字上标字体标记
7.tt---打印机字体标记
8.cite---引用方式的字体,通常是斜体
9.em---表示强调,通常显示为斜体字
10.strong---表示强调,通常显示为粗体字
11.small---小型字体标记
12.big---大型字体标记
13.u---下划线字体标记
小练习:
<html> <head> <title>第四节课</title> <meta charset="UTF-8"> </head> <body> Hn标题标记 文本编辑<br/> <h1>文本编辑</h1> <h2>文本编辑</h2> <h3>文本编辑</h3> <h4>文本编辑</h4> <h5>文本编辑</h5> <h6>文本编辑</h6> font 标记 文本编辑 <font size="1">文本编辑</font> <font size="3">文本编辑</font> <font size="7">文本编辑</font> <font size="7" color="red" face="微软雅黑">文本编辑</font> <font size="7" color="red" face="宋体">文本编辑</font> <font size="7" color="red" face="新细明体">文本编辑</font> B标记加粗 文本编辑 <b>文本编辑</b> i标记斜体 文本编辑 <i>文本编辑</i> sub下标标记 2<sub>2</sub> sup上标标记 2<sup>2</sup> 引用标记 <cite>文本编辑</cite> em标记表示强调,显示为斜体 <em>文本编辑</em> strong标记表示强调,加粗显示 <strong>文本编辑</strong> small标记,显示小一号字体,可以嵌套使用,当字体为最小时将会显示最小字体字号 <small>文本编辑</small> <small> <small>文本编辑</small> </small> <small> <small> <small>文本编辑</small> </small> </small> big标记,显示大一号的字体 <big>文本编辑</big> <big><big>文本编辑</big></big> u标记是显示下划线 <big><big><big><u>文本编辑</u></big></big></big> </body> </html>