一、学习内容:
1.HTML5的新特性:
主要是增加了一些新的标签、新的表单和新的表单属性等,这些特性都有兼容性问题,基本上是IE9以上的浏览器才能支持,如果不考虑兼容性,可以大量使用这些特性。
HTML5新增的表单属性:
required表单拥有该属性百世内容不能为空,必填项
placeholder表单的提示信息
autofocus自动聚焦属性
autocomplete当用户输入内容时,浏览器之前提交过的内容,显示出相应提示内容
multiple可以多选文件进行提交
2.css3新增的选择器:属性选择器、结构伪类选择器、伪类选择器
属性选择器:
概念:属性选择器可以根据元素的特点属性来选择元素,这样就可以不借助于类或者id选择器
HTML新增的多媒体标签:视频和音频
音频常用的属性和属性值
autoplay:autoplay; 自动播放。
controls:controls; 像用户展示播放控件
loop:loop; 当音频结束时重现开始播放
src:url; 要播放的音频的url(地址)
结构伪类选择器:
概念:结构伪类选择器主要是根据文档的结构来选择元素,通常用于根据父元素来选择
nth-child和nth-of-type的区别:
nth-child对父元素里面所有的子元素排序选择(序号是固定的),先找到第n个孩子,然后再看是否和相应元素匹配
nth-of-type对父元素里面的所有指定的子元素进行排序选择,先去进行相应元素的匹配,再排序去选择第n个元素
3.css3的怪异盒模型:
css3中可以通过box-sizing来指定盒模型,它有两个值,分别为content-box 和 border-box
box-sizing:content-box;盒子的大小是width+padding+border(默认值)
box-sizing:border-box; 盒子的大小为width;
使用box-sizing:border-box; 时,padding和border都不要超过盒子本身的宽高。
|