html语义化|青训营笔记

136 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第3天 HTML标签跟语义化 1、(1)列表 无序列表

    ul是表示无序列表的整体,li标签表示无序列表的每一项 ul标签只允许嵌套li标签,li标签中可以嵌套任意内容 有序列表
      ol属性表示有序列表的整体,li标签表示无序列表的每一项(用排名等) 自定义列表dl属性表示自定义列表的整体,用于包裹dt/dd标签 dt表示自定义类别的主题,dd表示自定义列表对主题的每一项内容 dd前会默认显示缩进效果 注意:dl标签只允许包含dt/dd标签 dt/dd标签可以包含任意内容 (2)表格 (i)table表格整体,有包含多个tr tr表格每行,可用于包裹td td表格单元格,可以用于包裹内容 表格相关属性 属性名:border 属性值:数字 效果:边框宽度 属性名:width 属性值:数字 效果:表格宽度 属性名:height 属性值:数字 效果:表格高度 (ii)合并单元格 跨行合并rowspan 跨列合并colspan 在td后面然后合并的那项删除 2、表单标签 (1)input input text 文本框,用于输入单行文本 input password 密码框,用于输入密码 input radio 单选框,用于多选一 input checkbox 多选框,用于多选多 input file 文件选择,用于之后上传文件 input submit 提交按钮,用于提交 input reset 重置按钮,用于重置 input button 普通按钮,默认无功能,之后配合js添加功能 input占位提示符
      input单选功能跟默认选择 性别:女 多文件选择: (2)button 我是按钮 提交按钮 重置按钮 普通按钮,没有任何功能 (3)select下拉标签 select:整体 selected下拉菜单的默认属性 option:下拉的每一项 (4)label标签可以点击文本然后选择对应选项 女 3、语义化标签 (1)没有语义的标签 div(独占一行)span(不带任何效果,不独占一行) (2)有语义的标签 4、字符实体 空格