likes
comments
collection
share

HTML标签

作者站长头像
站长
· 阅读数 23

一、列表标签(网页中展示行内容,按照行的方式,整齐显示内容)

1.有序列表
    <ul>
        <li></li>
    </ul>
特点:
    ①列表每项前有 “·”
    ②文字没有靠左
    ③li有默认装饰
2.无序列表
    <ol>
        <li></li>
    </ol>
特点:
    与有序列表相同
    列表每项前有数字
3.**自定义列表**(通常会在页面底部使用)
    <dl>   -------整体标签(dl标签中只能出现dt和dd标签)
    <dt></dt> ----标题
    <dd></dd> ----标题描述
    </dl>

二、表格标签

1.表格的基本标签:
<table>  --------表格整体(包裹在最外边)
    <tr></tr>----表格的行
    <td></td>----表格的列
</table>
2.表格相关属性
border 边框
width  宽度
height 高度
align 表格对齐方式(left、right)
cellspacing 单元格间距
cellpadding 内容与单元格间距
<table border='1' width='100' height='10'>
3.表格标题和表头单元格
<table>
    <caption></caption> ---表格整体大标题 默认剧中
    <th></th> -------------一列小标题,用于表格第一行,默认加粗居中
</table>
4.表格的结构标签(可省略,包裹tr)
thead  tbody  tfoot
5.合并单元格(水平/垂直的多个单元格合并成一个  保一删一)
    rowspan
    clospan
注意:只有同一个结构标签才能合并,不能跨thead,tbody,tfoot

三、表单标签(type属性值表现不同的效果)(收集用户信息,提交给后台)

1.input系列标签     type=‘’    
*text:文本框,单行文本 pleaceholder:占位符(提示用户输入框内容)             (name/value属性  name给input设置名字 value提交后台名字)
*password:密码框
*radio:单选 想要实现单选 需要给同一组单选按钮增加相同的name属性值
*checkbox:多选 
*file:文件选择 多文件上传  multiple
*submit:提交 将数据提交到后端
*reset:重置 将书写的数据进行清空
*button:按钮
2.button按钮标签
<button type='submit/reset/button'>提交/重置/按钮</button>
3.select下拉菜单  默认选中  selected
<select>
<option></option>
</select>
4.textarea文本域  支持多行文字
    标签中 识别换行和空格 右下角拖拽改变大小 实际用于开发时针对样式效果        推荐css样式
<textarea></textarea>
5.label 标签 增加用户体验 增加表单控件范围 label标签中只能出现一个        input标签    
    使用方法:
        使用label包含需要点击的内容
        给label的for属性添加属性值
        给需要选择的表单控件增加id属性并且值为上面for里的值

四、语义化标签

1.无语义化的标签
    <div></div> 独占一行  类似<h1></h1>
    <span></span> 一行显示多个
2.有语义化的标签
    <header></header>

五、字符实体

语法:
    &nbsp; 空格
    &gt;  大于号
    &lt;  小于号