目录
HTML5新增标签
1.结构性标记
2.多媒体标记
3.表单标记
列表标签
表格标签
表格相关修饰属性:
HTML有10个表格相关的标签:
表单标签
1.表单域
2.表单元素
HTML5新增标签
1.结构性标记
结构性标记主要用来对页面结构进行划分,就像在设计网页时将页面分为导航、内容部分、页脚等,确保HTML文档的完整性。
● article:用于表示一篇文章的主题内容,一般为文字集中显示的区域。
● header:页面主体上的头部。
● nav:是专门用于菜单导航、链接导航的标记。
● section:用于表达书的一部分或一章,在Web页面应用中,该标记也可用于区域的章节表述。
2.多媒体标记
多媒体标记主要解决了以往通过 Flash等进行视频的一些展示,新增的标记使HTML功能变得更加强大了。
● video:视频标记,用于支持和实现视频文件的直接播放,支持缓冲预载和多种视频媒体格式,如WEBM、MP4、OGG。
● audio:音频标记,用于支持和实现音频文件的直接播放,支持缓冲预载和多种音频媒体格式,如MP3、OGG、WAV。
3.表单标记
表单标记主要用于功能性的内容表达,会有一定的内容和数据的关联。
● datalist:配合< Input/>标记定义一个下拉列表。
列表标签
- <ul> 和 <ol> 元素设置margin的顶部和底部: 16px(1em) 0;和 padding-left: 40px(2.5em); (在这里注意的是浏览器默认字体大小为16px)。
- <li>
- <dl>
- <dd> 元素设置为:margin-left
40px
(2.5em
)。 - list-style-type :设置用于列表的项目符号的类型,例如无序列表的方形或圆形项目符号,或有序列表的数字,字母或罗马数字。
- list-style-position :设置在每个项目开始之前,项目符号是出现在列表项内,还是出现在其外。
- list-style-image :允许您为项目符号使用自定义图片,而不是简单的方形或圆形。
- background-image: 充当项目符号的图片文件的参考路径
- background-position: 这定义了所选元素背景中的图像将出现在哪里 - 在我们的示例中设置
0 0
,这意味着项目符号将出现在每个列表项的最左上侧。 - background-size: 设置背景图片的大小。 理想条件下,我们想要项目符号与列表项的大小相同(比列表项稍大或稍小亦可)。 我们使用的尺寸为1.6rem(16px),它非常吻合我们为项目符号设置的 20px 的填充, 16px 加上 4px 的空格间距,可以使项目符号和列表项文本效果更好。
- background-repeat:默认条件下,背景图片不断复制直到填满整个背景空间,在我们的例子中,背景图片只需复制一次,所以我们设置值为
no-repeat
。
表格标签
表格相关修饰属性:
border(指定表格的边框的宽度)比如<table border="1"> border=1 表示表格边框的粗细为1像素(默认值),为0表示没有边框。
width(指定表格的宽度)
height(指定表格的高度)
bgcolor(背景颜色)
background(背景图片)
cellpadding(指定边框与内容之间的空白)
cellspacing(指定单元格之间的空白)
bordercolor(表格的边框颜色,当border值不为0时设置此值有效。取值同bgcolor)
bordercolorlight(亮边框颜色,当border值不为0时设置此值有效。亮边框指定表格的左边和上边的边框)
bordercolordark(暗边框颜色,当border值不为0时设置此值有效。暗边框指定表格的右边和下边的边框)
align(表格的对齐方式,值有:left center right)
valign(表格的垂直对齐方式,值有:top middle bottom)
HTML有10个表格相关的标签:
<caption>定义表格标题
<col>为表格的列定义属性
<colgroup>定义表格列的分组
<table>定义表格
<tbody>定义表格主体
<td>定义一个单元格
<tfoot>定义表格的表注(底部)
<th>定义表格的表头
<thead>定义表格的表头
<tr>定义表格的行
表单标签
1.表单域
<form action="后台地址" method="请求方式" name="表单名字"> </form>
2.表单元素
<input type="属性值"> 输入型表单元素,单标签
type属性的描述:
button 定义可点击的按钮,用于通过JavaScript启动脚本
checkbox 定义复选框
file 定义输入字段和“浏览”按钮,供文件上传
hidden 定义隐藏的输入字段
image 定义图像形式的提交按钮
password 定义密码字段,呈现加密形式
radio 定义单选按钮
reset 定义重置按钮,重置按钮会清除表单中的所有数据
submit 定义提交按钮,会把表单数据发送到服务器
text 定义单行的输入字段,可在其中输入文本,默认宽度为20字符