HTML5+CSS3新增内容总结!!!!!绝对干货

说到H5C3会不会觉得东西好多啊,今天就整理了一份总结性的内容;
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转换

如果你想学习前端可以来这个群,首先是291中间是851最后是189,里面可以学习和交流,也有资料可以下载。

CSS3新增伪类有那些?
p:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素。
    p:last-of-type  选择属于其父元素的最后 <p> 元素的每个 <p> 元素。
    p:only-of-type  选择属于其父元素唯一的 <p> 元素的每个 <p> 元素。
    p:only-child    选择属于其父元素的唯一子元素的每个 <p> 元素。
    p:nth-child(2)  选择属于其父元素的第二个子元素的每个 <p> 元素。
    :enabled、:disabled 控制表单控件的禁用状态。

:checked,单选框或复选框被选中。

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框架
<!--[if lt IE 9]>
<script> src="网页链接
<![endif]-->
上述内容都是自己总结的如有错误欢迎指正

时间: 2024-08-22 15:16:56

HTML5+CSS3新增内容总结!!!!!绝对干货的相关文章

献给网页设计师的HTML5/CSS3/JS便捷工具

  是时候为网页设计师的来一组便捷的辅助工具了.日新月异的网页技术革新催生了大量的设计与开发工具,HTML5/CSS3几乎成了设网页设计师的必修课,而强大的JS也为网页提供了更多的可能性.尤其是HTML5,作为一门极为有用且实用的标记语言,它赋予网页设计师创造更优秀网页的可能. 这也是为什么,身为网页设计师的你需要不停地了解最新的技术趋势和新兴工具,这些全新的库.框架.插件和技术能让你的网页如虎添翼. HTML5使得设计师和开发者在各个不同领域都比之前更强大了.快速,漂亮,安全,响应式,这些特性

HTML5/CSS3的开发框架:实用HTML5和CSS3框架

文章简介:所有的开发人员都应该注意了,你们绝对应该看看这篇文章,帮助你快速创建HTML5/CSS3的开发框架.可能你也看到过其它的框架,但是你应该看看这些框架,因为你以前可能没用过他们中的大部分.看看最新的实用HTML5和CSS3框架吧! 所有的开发人员都应该注意了,你们绝对应该看看这篇文章,帮助你快速创建HTML5/CSS3的开发框架.可能你也看到过其它的框架,但是你应该看看这些框架,因为你以前可能没用过他们中的大部分.看看最新的实用HTML5和CSS3框架吧!希望你们喜欢! 1.HTML5b

HTML5 CSS3简明教程

Web 设计师可以使用HTML4和CSS2.1完成一些很酷的东西.我们可以在不使用陈旧的基于table布局的基础上完成文档逻辑结构并创建内容丰富的网站.我们可以在不使用内联<font>和<br>标签的基础上对网站添加漂亮而细腻的风格样式.事实上,我们目前的设计能力已经让我们远离了那个可怕的浏览器战争时代.专有协议和那些充满闪动.滚动和闪烁的丑陋网页. 虽然我们现在已经普遍使用了HTML4和CSS2.1,但是我们还可以做得更好!我们可以重组我们代码的结构并能让我们的页面代码更富有语义

提供超多HTML5+CSS3响应式网页模版免费下载的酷站

  今天介绍的HTML5 UP! 提供大量的HTML5 模版,而且这些模版都支持响应式网页设计 ,有了它我们就不用从无到有.从头到尾来打造一个网站,而是直接就现有的样版去做修改或调整,让建网站难度降低许多,也减少花费的时间和开支.来收! 因为自适应网页设计在开发上较为繁琐,一般很少免费提供下载的网站,但 HTML5 UP! 收录一系列共 28 种网页设计,通通都是 HTML5+CSS3 并有响应式设计 功能,网站采用的授权方式为 Creative Commons 姓名标示 3.0,也就是说你可以

10个便利的HTML5/CSS3框架

来源:GBin1.com 所有的开发人员都应该注意了,你们绝对应该看看这篇文章,帮助你快速创建HTML5/CSS3的开发框架.可能你也看到过其它的框架,但是你应该看看这些框架,因为你以前可能没用过他们中的大部分. 看看最新的实用HTML5和CSS3框架吧!希望你们喜欢! 1. HTML5boilerplate H5BP 带给你非常漂亮的文档,一个网站优化的编译脚本,还有一个自定义的boilerplate编译器.除此之外,我们还支持lighttd,Google App Engine和NodeJS以

08. Web大前端时代之:HTML5+CSS3入门系列 ~ QQ空间时间轴

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html  大前端系列,主要就是使用CSS3.0来实现,注释我已经打在代码里面了,直接看代码就可以了,后面会说一下CSS3.0系列,这个就当一个引入吧:   简单版本: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content=&q

Web大前端时代之:HTML5+CSS3入门系列

联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTDotNet/ 思维导图(不断更新): 图片:http://dnt.dkill.net/DNT/HTML5/index.jpg 源码:http://dnt.dkill.net/DNT/HTML5/h5.zip 在线文档:http://dnt.dkill.net/DNT/HTML5   00.Web大前端时代之:HTML5+CSS3入门系列~B

03.Web大前端时代之:HTML5+CSS3入门系列~H5功能元素

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(section)的标题进行组合 2.figure <figure> 标签规定独立的流内容(图像.图表.照片.代码等等). figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响. Figcaption figure的标题 一般格式: <figure> <figcap

04. Web大前端时代之:HTML5+CSS3入门系列~HTML5 表单

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 一.input新增类型: 1.tel:输入类型用于应该包含电话号码的输入字段   2.url:用于应该包含 URL 地址的输入字段 - 提交表单时对 url 字段的值自动进行验证 <form action="/test.html" method="post"> url:<input type="u