标签 tag

基础标签

div 块元素

介绍：没有任何含义，主要用于 div 进行模块布局

类型：块级元素 block，盒子占用宽度为一整行


(资料图片仅供参考)

属性：没有属性

我是模块
我是模块

span 行内文本元素

介绍：没有任何含义，主要用于展示文本内容

类型：内联元素 inline，盒子占用宽度根据内容决定

属性：没有属性

我是内容
我是内容

p 段落元素

介绍：默认自带了 margin 样式，主要用于展示一段内容

类型：块级元素 block，独占一行

属性：没有属性

我是内容我是内容我是内容我是内容

我是内容我是内容我是内容我是内容

img 图片元素

介绍：单标签、主要用于展示图片

类型：内联元素 inline，占用位置根据图片宽度决定

属性：

加载失败

h1 ~ h6 一级标题 ~ 六级标题

介绍：默认自带了 margin 和 font 样式，主要用于展示不同级别标题

类型：块级元素 block，盒子占用宽度为一整行

属性：没有属性

我是标题1
我是标题2
我是标题3
我是标题4
我是标题5
我是标题6

我是标题1

我是标题2

我是标题3

我是标题4

我是标题5
我是标题6

a 超链接

介绍：默认自带了 font 样式，主要用于展示超链接文字

类型：内联元素 inline，盒子占用宽度根据内容决定

属性：

点我跳转
点我跳转

table 表格元素

介绍：一般需要结合 thead、tbody、tr、th、td 标签进行使用，主要用于展示表格

类型：表格元素 table，盒子占用宽度为一整行

属性：

子元素：

            
            姓名            年龄            性别        
                
            xiaoming            12            男        
        
            anqila            16            女
姓名年龄性别
xiaoming12男
anqila16女

ul、li 无序列表

介绍：ul 默认自带了 margin、padding 样式，一般需要结合 li 使用，主要用于展示没有序号的列表

类型：块级元素 block，盒子占用宽度为一整行

属性：没有属性

        
  • xiaoming
    •     
  • libai
    •     
  • anqila

ol、li 有序列表

介绍：ol 默认自带了 margin、padding 样式，一般需要结合 li 使用，主要用于展示有序号的列表

类型：块级元素 block，盒子占用宽度为一整行

属性：没有属性

        
  1. xiaoming
    2.     
  2. libai
    3.     
  3. anqila
  1. xiaoming
  2. libai
  3. anqila

表单标签

input 输入框

介绍：单标签、默认自带了 margin、width 样式，主要用于展示输入框

类型：行内块级元素 inline-block，盒子占用宽度根据内容决定

属性：

    
    
    男    女
    男    女

男女

男女

textarea 文本域

介绍：默认自带了 padding、border、width 样式，主要用于展示多行文本输入框

类型：行内块级元素 inline-block，盒子占用宽度根据内容决定

属性：

button 按钮

介绍：默认自带了 padding、border 样式，主要用于展示按钮

类型：行内块级元素 inline-block，盒子占用宽度根据内容决定

属性：没有属性

select、option 下拉框

介绍：默认自带了 border 样式，一般需要结合 option 使用，主要用于展示下拉框

类型：行内块级元素 inline-block，盒子占用宽度根据内容决定

属性：

多媒体标签

canvas 绘图

在 HTML5 中提供了 canvasAPI ，允许在 canvas 画布上绘制图形

ie6、7、8 不兼容

<script>    var canvas = document.getElementById("myCanvas")    var context = canvas.getContext("2d")    context.moveTo(0, 0) // 绘制第一个点，坐标是（0, 0）    context.lineTo(300, 300) // 绘制第二个点，然后连线，坐标是（300, 300）    context.lineWidth = 5 // 线条宽度    context.strokeStyle = "#058" // 线条颜色    context.stroke() // 开始绘制</script>

svg、path 矢量图形

介绍：默认自带了 width、height 样式，一般需要结合 path 使用，主要用于展示矢量图形

类型：内联元素 inline，占用位置根据矢量图形宽度决定

属性：

audio 音频

介绍：主要用于展示音频播放器

属性：

video 视频

介绍：主要用于展示视频播放器

属性：

推荐内容