前端之HTML语法及常用标签

时间:2019-05-10 19:03:00 来源:互联网 作者: 神秘的大神 字体:

html语法:

1.常规标记:

<标记 属性=“属性值” 属性=“属性值”></标记>;

2.空标记:

<标记 属性=“属性值” 属性=“属性值”/>

注意事项:

= 和 “”都是必须加的,同时两个属性之间用空格 隔开;

html常用标签:

1.文本标题:    h1 h2 h3 h4 h5 h6   ;

2.段落标记:   p  ;

3.空格(html转义字符):&nbsp    ;

   >                                      &gt       ;

   <                                      &lt         ;

4.换行      :       <br/>

5.加粗     :    strong     b                   ;

6.倾斜    :   i             em                ;

7.水平分隔线:           <hr/>           ;

8.上标         :         sup                ;

    下标         :         sub                ;

9.列表:

  无序列表:    ul                    ;

  有序列表:    ol                   ;

自定义列表   ;    dl                  ;

10.图片:

<img src="图片路径"

title="鼠标悬停在图片上时显示的提示信息"

alt="当图片由于某些原因无法正常加载时显示的替换信息"

width="x"

height="y"/>

11.超链接:

<a href="链接地址" target="_blank" title="提示信息">链接文本或图片</a>   

        rget="_blank" 链接在新页面打开

            target="_self"  默认属性值,在本页面打开

12.表格: table

    <table border="1" cellspacing="0" cellpadding="0">

                     <tr>

                             <td width="100" align="center">aaa</td>

                             <td valign="top">aaa</td>

                             <td>aaa</td>

                             ...

                     </tr>

          </table>

 

注:table相关属性

 

    a)width="值"   设置表格宽度或单元格宽度

 

    b) height="值"  设置表格高度或单元格高度

 

    c) border="值"  设置表格边框(一般给table加)

 

    d)cellspacing="值"   设置单元格之间的间距(给table加,一般设为0)

 

    e) ellpadding="值"   设置内容与单元格之间的空隙(给table加,一般设为0)

 

    f) align="left|center|right"  设置单元格内容水平对齐方式

 

    g) valign="top|middle|bottom" 设置单元格内容垂直对齐方式

 

    h) bgcolor="颜色值"  设置表格背景色(一般通过css样式去设置)

 

    i) colspan="数值"  合并列(给td加)

 

    j) rowspan="数值"  合并行(给td加)

 

注:table常用到的标签

 

    a)table  定义表格

 

    b) tr     代表行

 

    c) td     代表列

    d) th     定义表格的表头(会有加粗,居中的效果)

 

    e) caption   定义表格的标题

 

    f)thead  定义表格的页眉

    g) tbody  定义表格的主体

    h) tfoot  定义表格的页脚