菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 杨国强_H5C3-20221122 [打印本页]

作者: 违心 时间: 2022-11-22 17:50
标题: 杨国强_H5C3-20221122
一.今日学习内容：
HTML5：
1.html5的新特性：
  增加了一些新的标签，新的表单和新的表单属性，只支持ie9以上的版本浏览器，如果不考虑兼容性，可以大量使用。
html5常用标签
优点：
语义更加明确；便于浏览器进行解析。
缺点：
大部分的标签只有chrome和safari支持。
html5新增的input类型
新增的type属性值
email 限制用户输入内容必须为邮箱；url限制用户输入的内容必须为url地址；date生成日期控件；time 生成时间控件，month 生成月份控件；week生成月份控件；number限制用户输入内容必须为数字；search 可以将用户输入的内容进行清除；color 生成一个颜色选择标单元素。
html5新增表单属性
placeholder 给表单元素添加提示文本，和value同时使用时则不会进行提示文本的展示。
multiple 属性值为required  校验当前元素是必填项。
autofocus 属性值为autofocus  当页面刷新时自动聚焦到指定的表单元素
autocomplete属性值为on/off 选择是否记录用户提交过的内容，on代表记录，off代表不记录。
注意：使用该属性，必须要加上name属性才可以生效
html5新增的多媒体标签
<video>标签
概念：
h5可以在不使用插件的情况下，可以使用原生的标签来实现视频格式文件的播放。
相关的属性
autoplay  属性值 autoplay 视频就绪自动播放，需要和muted同时使用，播放必须是默认静音的。
control 属性值 control  给video标签增加视频播放控件
width 属性值像素值控件播放器的宽度
height 属性值  像素值  控件播放器的高度
loop 属性值 auto预加载和none不预加载规定是否预加载
src 属性值url 视频的url地址
poster 属性值 imgurl 加载等待的画面图片
muted属性值muted 静音播放
<audio>标签
常用的属性
controls 属性值 controls  让音频显示相应的控件
loop 属性值 loop    当音频结束时要重新开始播放
src  属性值音频的url地址
CSS3
css3怪异盒模型
通过box-sizing来指定盒子模型
content-box border-box
注意：使用box-sizing：border-box的时候，padding和border不要超过盒子的宽度。
css3的新增属性
属性选择器
结构伪类选择器
伪元素选择器
css过渡
transition 属性值：1.想要改变的css属性；2.花费时间；3.运动曲线；4.何时开始

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)