HTML常用标签

1，

作用：html标签可以让页面结构更加清晰

        1.1        <h1></h1>--<h6></h6>

             标签语义：作为标题使用，独占一行，使文字加粗，加大字号，凸显文字重要性。

<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>

        

        1.2        <p> </p>

                         标签语义：可以把HTML文档分割成不同段落，会根据浏览器窗口自动换行，

段落之间留有空隙。

<p>第一段</p>
<p>第二段</p>
<p>第三段</p>
<p>第四段</p>

        

        1.3        <br>

                         标签语义：强制换行。

<p>我是</br>社会主义接班人</P>

2，文本标签

        2.1        <strong></strong>或者<b></b>

                       标签语义：加粗，建议使用<strong></strong>语义更加强烈

<strong>加粗</strong>
<b>加粗</b>

        2.2       <em></em>或者<i></i>

                        标签语义：倾斜，建议<em>

<em>倾斜</em>
<i>倾斜</i>

        2.3        <del></del>或者<s></s>

                        标签语义：删除线，建议使用<del>

<del>删除线</del>
<s>删除线</s>

        2.4        <ins></ins>或者<u></u>

                        标签语义：下划线，建议使用<ins>

<ins>下划线</ins>
<u>下划线</u>

        2.5        <span></span>                用于布局，一行可放多个小盒子

                     <div></div>                       用于布局，独占一行

3，图片标签

3.1，        <img src="图像路径"        alt="图像加载失败替换的文字"        title="鼠标放上图片显示的提示文本"        width="宽度"        height=''高度''        border=''像素''/>

<img src="1.jpg" alt="加载失败" title="111" width="100px" height="120px" border="0.5"/>

3.2        <a href="跳转目标链接" target="新窗口打开方式（_self当前标签打开，_blank在新的窗口打开）" >图像或文本</a>

<a href="跳转目标链接" target="_self" ></a>

3.3        锚点链接

                <a href="#id名">跳转</a>

<a href="#01">跳转</a>
<p id="01">*****</p>

4，特殊字符

                   

特殊字符

空格	 
小于号	&lt;	<
大于号	&gt;	>
和	&amp;	&
人民币	&yen;	¥
版权	&copy;	©
注册商标	&reg;	®
摂氏度	&deg;	°
正负号	&plusmn;	±
乘号	&times;	×
除号	&divide;	÷
平方2 (上标2)	&sup2;	²
立方3 (上标3)	&sup3;	³

                
5，表格

作用：更加清晰的显示，展示数据。

<table></table>        用于定义表格的标签;；

<tr></tr>                   定义表格中的行，必须嵌套在<table></table>标签中使用；
<td></td>                 定义表格中的单元格，必须嵌套在<tr><>tr>标签中使用；

<table>
        <tr>
            <td>单元格中的文字</td>
            ...
        </tr>
    </table>

5.1        th        用于表格第一行，突出重要性，加粗，居中显示。

<table>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
            <th>其他</th>
        </tr>
</table>

 5.2       表格属性

属性名	属性值	描述
align	left，center，right	表格在浏览器中的对齐方式
border	1或" "	边框
cellpadding	像素值	单元格边框与内容之间的空隙，默认1像素
cellspacing	像素值	单元格之间的空白，默认2像素
width	像素值或百分比	表格宽度

                
5.3        表格标签

        <thead></thead>      表格头部 ；

        <tbody></tbody>        表格主题区域；

​
<table>
        <thead>
            <tr>
                <th>头部</th>
            <tr>
        </thead>

        <tbody>
            <tr>
                <td>表格主体</td>
                ...
            </tr>
        </tbody>
    </table>

​

       跨行合并                 rowspan="合并单元格的个数"               

       跨列合并                colspan="合并单元格的个数"               

    无序列表        会在文本前加一个  .

​
<h3>无序列表</h3>
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>

​

有序列表        会自动给文本加编号

<h3>有序列表</h3>
        <ol>
            <li></li>
            <li></li>
            <li></li>
        </ol>

自定义列表        

<h3>自定义列表</h3>
        <dl>
            <dt></dt>
            <dd></dd>
            <dd></dd>
        </dl>   

表单

        作用：收集用户信息；

<form></form>        表单域

                                表单控件

                                提示信息