HTML中提供了很多的标记,可以用来设计页面的文字、图片,定义超链接等。这些标记的使用可以使页面变得更加生动。下面介绍HTML中的文本标记。
常见的集中标记
1、换行标记
要让页面中的文字实现换行,在HTML文件中输入换行符(ENTER)是没有用的,如果要实现换行就要用换行标记符,在<>中写入br。
2、段落标记
段落标记在HTML文件中是一个很重要的标记,要实现段落标记就有用p表示,具体例子会在下边展示。
3、标题标记
在HTML中,设定了6个标题,分别是h1到h6,数字越大,表示标题级数越低,反之,级数越大。
4、居中标记
HTML的内容有一定的布局,默认的布局方式是由左向右依次排列,但是如果想要居中表示,就要使用居中标记符号,center或者是使用 div设定布局方式为center具体例子下边展示。
5、文字列表标记
HTML中提供了文字列表标记,文字列表的标记可以使文字以列表的形式依次排列。通过这种形式可以更加方便用户的访问。有两种列表形式,有序列表和无序列表。(1)无序列表:使用ul和li表示(2)有序列表:使用ol和li表示
6、区域标记
span标签是用来组合文档的行内元素。其本身没有固定格式。span和div的区别是:span标签是行内元素,而div是块元素。
7、表格标记
(1)表格标记:table
(2)标题标记:caption
(3)表头标记:th
(4)表格行标记:tr
(5)单元格标记:td

下边是具体实例:
换行标记:

<br>//表示换行

段落标记:

<p>正文内容1</p>

标题标记:

<h2 class="two">应用了选择器two</h2>

居中标记:

<center>填所有居中的内容</center>

文字列表标记:
1、无序列表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>无序列表标记</title>
</head>
<body>
    编程词典有以下几个品种
    <p>
    <ul>
        <li>Java编程词典</li>
        <li>VB编程词典</li>
        <li>VC编程词典</li>
        <li>.net编程词典</li>
        <li>C#编程词典</li>
    </ul>
    </p>
</body>
</html>

2、有序列表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>无序列表标记</title>
</head>
<body>
    编程词典有以下几个品种
    <p>
    <ol>
        <li>Java编程词典</li>
        <li>VB编程词典</li>
        <li>VC编程词典</li>
        <li>.net编程词典</li>
        <li>C#编程词典</li>
    </ol>
    </p>
</body>
</html>

区域标记:

<div style="text-align: center;"><!--设置内容居中-->
<h2 class="one">应用了选择器one</h2><!--定义样式后页面会自动加载样式-->
<p>正文内容1</p>
<h2 class="two">应用了选择器two</h2>
<p>正文内容2</p>
<h2 class="three">应用了选择器three</h2>
<p>正文内容3</p>
    </div>

表格标记:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table width="98%" height="114" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
    <tr>
        <td bgcolor="#FFFFFFF" title="单元格1">
            <a href="example2-14.html">单元格1</a>
        </td>
        <td bgcolor="#FFFFFFF" title="单元格2">单元格2</td>
        <td bgcolor="#FFFFFFF" title="单元格3">单元格3</td>
    </tr>
    <tr>
        <td bgcolor="#FFFFFFF" title="单元格4">单元格4</td>
        <td bgcolor="#FFFFFFF" title="单元格5">单元格5</td>
        <td bgcolor="#FFFFFFF" title="单元格6">单元格6</td>
    </tr>
    <tr>
        <td bgcolor="#FFFFFFF" title="单元格7">单元格7</td>
        <td bgcolor="#FFFFFFF" title="单元格8">单元格8</td>
        <td bgcolor="#FFFFFFF" title="单元格9">单元格9</td>
    </tr>
</table>
</body>
</html>