第十六章,表单HTML5引入了新的表单元素、输入类型和属性,以及内置的对必填字段、电子邮件地址、URL以及定制模式验证。元素:<input type="email"> ---- 电子邮件框<input type ...
第十六章,表单
HTML5引入了新的表单元素、输入类型和属性,以及内置的对必填字段、电子邮件地址、URL以及定制模式验证。
属性 | 总结 |
accept | 限制用户可上传文件类型 |
autocomplete | 对form元素或特定字段添加autocomplete=“off”,将关闭浏览器的自动填写行为 |
autofocus | 页面加载后将焦点放到该字段 |
multiple | 允许输入多个电子邮件地址,或上传多个文件 |
list | 将datalist与input联系 |
maxlength | 指定textarea的最大字符数,文本框在H5之前就支持此属性 |
pattern | 定义一个用户所输入的文本在提交之前必须遵循的模式 |
placeholder | 出现在文本框中的提示文本 |
required | 在提交表单前必须填写该字段 |
formnovalidate | 关闭H5自动验证功能,应用于提交按钮 |
novalidate | 关闭H5自动验证功能,应用于表单元素 |
对表单元素进行组织
创建单选按钮
同一组单选按钮的input元素的name属性必须都一样,type="radio"
伪类在网页中添加单个视频
使用video元素,
<video src='/images/loading.gif' data-original="my-video.ext"></video>
<video src='/images/loading.gif' data-original="my-video.ext" controls></video><video src='/images/loading.gif' data-original="my-video.ext" autoplay controls> </video>
<video src='/images/loading.gif' data-original="my-video.ext" autoplay loop></video><video src='/images/loading.gif' data-original="my-video.ext" poster="paddle-steamer-poster.jpg" controls></video>
<video src='/images/loading.gif' data-original="my-video.ext" proload="none" controls></video>
<body> <video width="369" height="208" controls> <source src='/images/loading.gif' data-original="paddle-steamer.mp4" type="video/mp4"><!-- 浏览器支持则播放,忽视后面所有文件,否则跳到下一个source--> <source src='/images/loading.gif' data-original="paddle-steamer.webm" type="video/webm><!-- 类推 --> <p><a href="paddle-steamer.mp4">Download the video</a></p><!-- 在浏览器不支持时显示 --> </video></body>
audio元素属性第十八章,表格
使用<table>元素,如果需要可以输入<caption>元素,<caption>caption content</caption>,caption content用于描述表格。
第十九章,添加JavaScript
js最好都放在HTML页面的最后面,即</body>的前面,如果非要在head元素内加载js文件,也应该是在所有加载CSS文件之后
第二十章,测试和调试网页
使用BrowserStack(www.browserstack.com)和SauceLabs(http://saucelabs.com)可以在很多浏览器和移动设备上免费测试页面
原标题:HTML5与CSS3基础教程第八版学习笔记16
关键词:HTML
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。