HTML的基本结构及常用标签介绍

来源：互联网发布：dva的防御矩阵编辑：程序博客网时间：2024/05/20 01:35

学习Python爬虫时需要解析网页，需要一些网页制作知识，所以准备学习前端知识。
１．基本结构
　　HTML是一种文本标记语言，其基本结构如下：

<html>    <head>        <title>testPage</title>        <meta charset = "utf-8">        <meta name = "keywords" content = "My name,Jhon">        <!--meta标签给出网页的属性信息authur/keywords/description/others-->    </head>    <!--<body bgcolor = "green" text = "blue">-->    <!--body标签bgcolor/text/link/vlink/alink-->    <body link = "blue" vlink = "red" alink = "green">        <h1>This is a testPage!</h1>        <a href = "http://www.baidu.com">百度</a>    </body></html>

基本的标签包括html（必须有），head（网页名，网页信息，网页编码），body（其他所有网页中显示的内容在此）
２．常用格式标签
＜ｂｒ＞：强制换行。文本过长时网页会自动换行，但这个标签可实现在任意需要位置换行，省略形式＜ｂｒ／＞
＜ｐ＞：段落。重新建立一个段落时用的标签
＜ｃｅｎｔｅｒ＞：居中标签。将标签内容居中
＜ｐｒｅ＞：预格式标签。将标签中内容按原格式输出
＜ｌｉ＞：列表标签
＜ｕｌ＞：无序化标签
＜ｏｌ＞：有序化标签
＜ｈｒ＞：分割线
＜ｄｉｖ＞：<ｄｉｖ>可定义一个区域，将其他元素聚合，它可用于组合其他 HTML 元素的容器
例：

<html>    <head>        <title>testPage</title>        <meta charset = "utf-8">        <meta name = "keywords" content = "My name,Jhon">        <!--meta标签给出网页的属性信息authur/keywords　/description/others-->    </head>    <!--<body bgcolor = "green" text = "blue">-->    <!--body标签bgcolor/text/link/vlink/alink-->    <body link = "blue" vlink = "red" alink = "green">        This is a testPage!<br/>换行<br/>        <hr></hr>        <center>居中    显示</center>        <center><pre>居中    显示</pre></center>        <hr><hr><!--分界线-->        <li>列表1</li>        <li>列表2</li>        <li>列表3</li>        <ul>            <li>列表1</li>            <li>列表2</li>            <li>列表3</li>        </ul>        <ol type = "A" ><!--type可用于指定序号类型(1-数字,A--大写字母,a--小写字母,罗马大写 Ⅰ，罗马小写ⅰ) -->            <li>列表1</li>            <li value = "5">列表2</li>             <li>列表3</li>        </ol>        <ol type = "1"><!--type可用于指定序号类型(1-数字,A--大写字母,a--小写字母,罗马大写 Ⅰ，罗马小写ⅰ)-->            <li>列表1</li>            <li value = "5">列表2</li><!--value指定序列值-->            <li>列表3</li>        </ol>        <div>            first        <hr>            second        </div>        <a href = "http://www.baidu.com">百度</a>    </body></html>

3.常用文本格式
<ｈｎ>：标题h1-h6代表不同级别
<ｆｏｎｔ>：字体样式。包括大小size，颜色color，字体face
<ｂ>:加粗
<ｉ>：斜体
<ｓｕｐ>：下标
<ｓｕｂ>：上标
＜ｃｉｔｅ＞：引用方式的字体，通常为斜体
＜ｕ＞：加下划线
＜ｓｔｒｏｎｇ＞：强调
例：

<html>    <head>        <title>testPage</title>        <meta charset = "utf-8">        <meta name = "keywords" content = "My name,Jhon">        <!--meta标签给出网页的属性信息authur/keywords/description/others-->    </head>    <!--<body bgcolor = "green" text = "blue">-->    <!--body标签bgcolor/text/link/vlink/alink-->    <body link = "blue" vlink = "red" alink = "green">        <h1>This is a title</h1>        <h2>This is a title</h2>        <h3>This is a title</h3>        <h4>This is a title</h4>        <h5>This is a title</h5>        <h6>This is a title</h6>        This is a title <b>This is a title</b><i>This is a title</i>        <br>        2<sup>2</sup>        2<sub>2</sub>        <br>        <cite>This is a title</cite>        <br>        <u>This is a title</u>        <br>        <strong>This is a title</strong>        <font size = "5" color = "blue" face = "微软雅黑">This is a title</font>    </body></html>

阅读全文

0 0