对于HTML5+CSS3新增内容的总结-百分百源码网

对于HTML5+CSS3新增内容的总结

发布时间：09/01 来源：未知浏览：关键词：

说到H5+C3会不会觉得东西好多啊，今天就整理了一份总结性的内容。

CSS3选中器是什么？
属性选中器、伪类选中器、伪元素选中器。

CSS3新特性是什么？
1.色彩：新增RGBA，HSLA模式
2. 文字暗影（text-shadow、）
3.边框：圆角（border-radius）边框暗影： box-shadow
4. 盒子模型：box-sizing
5.背景：background-size 设定背景图片的尺寸background-origin 设定背景图片的原点
background-clip 设定背景图片的裁切区域，以”，”分隔可以设定多背景，用于自顺应规划
6.渐变：linear-gradient、radial-gradient
7. 过渡：transition，可实现动画
8. 自定义动画
9. 在CSS3中独一引入的伪元素是：：selection.
10. 媒体查询，多栏规划
11. border-image
12.2D转换：transform：translate(x，y) rotate(x，y) skew(x，y) scale(x，y)
13. 3D转换

CSS3新增伪类有那些？
:first-child选中某个元素的第一个子元素；
:last-child选中某个元素的最后一个子元素；
:nth-child(n)选中某个元素的一个或多个特定的子元素；
例：p:nth-child(3): 第三个必需是p元素不然无效

:nth-child(length);/*参数是详细数字*/
:nth-child(n);/*参数是n,n从0开端运算*/ 
:nth-child(n*length)/*n的倍数选中，n从0开端算*/
:nth-child(n+length);/*选中大于length后面的元素*/
:nth-child(-n+length)/*选中小于length前面的元素*/
:nth-child(n*length+1);/*表示隔几选一*/
//上面length为整数
:nth-child(n) //就是所有选中的元素
“n”只能是"n"，不克不及使用其他字母代替，不然会没有任何结果的。

:nth-last-child()选中某个元素的一个或多个特定的子元素，从这个元素的最后一个子元素开端算；
:nth-of-type()选中指定的元素；
例如：p:nth-of-child(3) 选中第三个p元素

:nth-last-of-type()选中指定的元素，从元素的最后一个开端运算；
:first-of-type选中一个上级元素下的第一个同类子元素；
:last-of-type选中一个上级元素的最后一个同类子元素
:only-child选中的元素是它的父元素的独一一个了元素；
:only-of-type选中一个元素是它的上级元素的独一一个雷同类型的子元素
:empty选中的元素里面没有任何内容
:not()不匹配该选中器的元素也就是除了某元素后的其他所有元素
:enabled、:disabled 操纵表单控件的禁用状态。
:checked，单选框或复选框被选中。
::first-line选中元素的第一行
::first-letter选中文本块的第一个字母
::before和::after这两个主要用来给元素的前面或后面插入内容，这两个常用”content”配合使用，写过最多的就是清除浮动
::selection用来改动阅读网页选中文的默许结果

html5是什么新特性、移除了那些元素？怎样处置HTML5新标签的阅读器兼容问题？怎样区分 HTML 和 HTML5？

新特性：
1. 拖拽开释(Drag and drop) API
2. 语义化更好的内容标签（header,nav,footer,aside,article,section）
3. 音频、视频API(audio,video)
4. 画布(Canvas) API
5. 地理(Geolocation) API
6. 当地离线储备 localStorage 长期储备数据，阅读器关闭后数据不丧失；
7. sessionStorage 的数据在阅读器关闭后主动删除
8. 表单控件，calendar、date、time、email、url、search
9. 新的技术webworker, websocket, Geolocation

支撑HTML5新标签：
* IE8/IE7/IE6支撑通过document.createElement办法发生的标签，
可以利用这一特性让这些阅读器支撑HTML5新标签，
阅读器支撑新标签后，还需要增加标签默许的样式：
* 当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架

以上就是关于HTML5+CSS3新增内容的总结的具体内容，更多请关注百分百源码网其它相关文章！

打赏