前端的入门现在基本是由 html 和 CSS 组合写静态页面开始, 下面为各位总结了 HTML5 和 css3 的新特性.
一, HTML5
1. 添加视频 Video 和音频 Audio 标签
2. 添加 canvas 画布和 svg 渲染矢量图片
3. 添加 input 表单控件 (datetime,datetime-local,week,date,month,time),color,email,number,range,search,tel,url.
4. 添加 web 存储功能, localStorage 本地离线可长期存储数据, 浏览器关闭后数据不丢失, sessionStorage 数据在浏览器关闭后自动删除.
5. 添加地理位置定位功能 Geolocation
6. 添加语义化更好的内容标签 hrader,footer,nav,section,article,aside,detailes,summary,dialog.
7. 添加拖拽释放 Drag and drop
8. 添加 Web worker 是运行在后台的 JavaScript, 独立于其他脚本, 不会影响页面的性能. 您可以继续做任何愿意做的事情: 点击, 选取内容等等, 而此时 Web worker 在后台运行.
9. 添加 WebSocket
(推荐学习: HTML 视频教程 https://www.html.cn/html/ )
二, css3
1. 添加边框属性: border-radius 圆角, border-image 圆角图片
2. 添加阴影属性: box-shadow 框阴影, text-shadow 文本阴影
3. 添加字体属性:@font-face 字体, text-wrap 自动换行, text-overflow 检索当当前行超过指定容器的边界
4. 添加选择器: E:last-child 匹配父元素的最后一个子元素, E:nth-child(n) 匹配父元素的第 n 个子元素, E:nth-last-child(n) CSS3 匹配父元素的倒数第 n 个子元素 E.(推荐学习: CSS 视频教程 https://www.html.cn/css/ )
5. 添加背景属性: background-size 图片设置大小, background-origin 设置定位区域, background-clip 背景颜色的绘制区域, background-break 控制背景怎样在这些不同的盒子中显示.
6. 添加转换属性 (translate,rotate,scale,skew,matrix,transform),3D 转换 (rotateX,rotateY)
7. 添加动画属性: Transition,Transform,Animation
8. 添加媒体查询:@media
9. 添加多列布局
更多前端开发知识, 请查阅 HTML 中文网 https://www.html.cn/ !
来源: http://www.css88.com/qa/html5/14857.html