一：大多浏览器支持，低版本也没问题 
    我看点这方面的资料，是为了做手机应用网站（有三个方案，这个是备用方案），可以开发响应式网站，可以脱离开发平台进行跨平台。 
    在Html5网页中引入Modernizr，就能让IE支持HTML5新元素。 
    HTML5样板文件快速开发（html5boilerplate.com）

二：布局、标签省时省力   
[html] view plaincopyprint?在CODE上查看代码片派生到我的代码片

<header>

<!--语义相当于<div class="header">-->

<nav>导航</nav>

</header>

这样开发者就不用标记标签的结束位置了，定位时会很方便，也易于搜索引擎进行判断。 
<header>定义页面或区段的头部； 
<footer>定义页面或区段的尾部； 
<nav>定义页面或区段的（主）导航区域； 
<section>页面的逻辑区域或内容组合，比如一个用于“简介”，另一个用于“新闻列表”。 
<article>定义正文或一篇完整的内容，能被直接粘贴到别的地方有独立意义，比如“博客正文”。 
<aside>定义补充或相关内容，侧边栏，广告栏等。 
<a>标签可以包含多个标签 
[html] view plaincopyprint?在CODE上查看代码片派生到我的代码片 
<a href="index.html"><h2>一</h2><img src="home.jpg"></a>

<vedio>、<audio>快速添加视频、音频 
[html] view plaincopyprint?在CODE上查看代码片派生到我的代码片

<video src="myVideo.ogg" controls width="640" height="480">这里提示你没有使用支持HTML5的浏览器</video> //controls播放控制栏；支持ogg和mp4格式；响应式视频：普通情况可以使用max-width:100% height:auto，如果是外部<iframe>视频，则使用FitVids的jQuery插件

三：离线Web应用 
    通过.manifest文件指定哪些文件可以离线访问的

四：更灵活的CSS3 
01.可以多栏显示文本 
column-width:12em; //试了几个浏览器好像很多无效的~

02.众多选择器 
body[id="2^"]{}  //id为"2"开头的标签 
li:first-child 、 li:last-child  //针对列表的首尾项

[html] view plaincopyprint?在CODE上查看代码片派生到我的代码片

li:nth-child(2n+1)//第“1”个li元素起，每“2”个颜色为红色

color: red;

}

<ul>

<li>һһһһһ</li>

<li>22222222</li>

<li>33333333</li>

</ul>

p::first-line{color:red;} //第一行文字为红色

五：更丰富CSS3 
传统CSS实现圆角、阴影等效果，一般要借助图片来实现，使用CSS3代替图片，可以有效减少http请求，取得更快的网页加载速度。不同浏览器对不同的CSS特性可能要使用不同的代码，可以使用预处理器SASS或LESS才处理。 
01.CSS3轻松应用边框圆角

[html] view plaincopyprint?在CODE上查看代码片派生到我的代码片

<html>

<head>

<style>

a

{

border-top-left-radius:8px;/*圆角位置和大小*/

border-top-right-radius:8px;

padding:0.8em;

}

</style>

</head>

<body>

<br />

<a href="#">圆角</a>

</body>

</html>

02.可以使用@font-face嵌入网页字体，还可以使用可缩放的ICON（非图片格式，fico.lensco.be）

补充： 
使用HTML5 Boilerplate来写HTML5网站，它带有组织好的文件夹结构和CSS文件，加入当前编码的最佳实践、浏览器的bug修复以及js库。

怎么样，优势明显，但是如果想真正入门的话，还是建议学一下北风网推出的 “跨平台开发技术-HTML5+CSS3从入门到精通(配两实战项目，兼顾PC版&&移动版网页+手游开发)” 课程，能总本质上给你带来帮助，从此踏入跨平台的程序后行列！

使用Html5+CSS3的优势的更多相关文章

  1. 【HTML5&CSS3进阶04】CSS3动画应该如何在webapp中运用

    动画在webapp的现状 webapp模式的网站追求的就是一个体验,是HTML5&CSS3浪潮下的产物,抛开体验不说,webapp模式门槛比较高: 而体验优化的一个重点便是动画,可以说动画是w ...

  2. HTML5+CSS3学习笔记（一）

    HTML5+CSS3概述 HTML5和CSS3不仅仅是两项新的Web技术标准,更代表了下一代HTML和CSS技术.虽然HTML5的标准规范还没有正式发布,但是未来的发展前景已经可以预见,那就是HTML ...

  3. 用Html5/CSS3做Winform，一步一步教你搭建CefSharp开发环境（附JavaScript异步调用C#例子，及全部源代码）上

    本文为鸡毛巾原创,原文地址:http://www.cnblogs.com/jimaojin/p/7077131.html,转载请注明 CefSharp说白了就是Chromium浏览器的嵌入式核心,我们 ...

  4. 好程序员分享DIV+CSS3和html5+CSS3有什么区别

    DIV+CSS3和html5+CSS3有什么区别,不管是DIV+CSS3还是html5+CSS3,他们都是我们对网页开发布局方式的统称,但是DIV+CSS3作为网页的基础开发这句话其实并不严谨,因为而 ...

  5. 用HTML5/CSS3/JS开发Android/IOS应用框架大全

    现在人人都想成为安卓/IOS应用开发工程师.其实,安卓/IOS应用可以用很多种语言来实现.由于我们前端开发工程师,对HTML5/CSS/JavaScript的网络编程已经相当熟悉了.所以,今天大家将会 ...

  6. HTML5+CSS3学习笔记（一） 概述

    HTML5+CSS3概述      HTML5和CSS3不仅仅是两项新的Web技术标准,更代表了下一代HTML和CSS技术.虽然HTML5的标准规范还没有正式发布,但是未来的发展前景已经可以预见,那就 ...

  7. front-end——HTML5/CSS3基础

    概述 1.什么是前端 前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页,随着互联网技术的发展,html5,css3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完 ...

  8. Web大前端时代之：HTML5+CSS3入门系列

    准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...

  9. 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

随机推荐

  1. SQL Server 2008 附加数据库之后显示为 只读 的解决方法

    嗯,附加完成后,数据库的灰色的,后面括号里写着(只读). 方法一: 碰到这中情况一般是使用的 sa 或者其它 SQL Server 身份验证登录的,只要改为 Windows 身份验证,再附加数据库即可 ...

  2. 腾讯云服务器 设置ngxin + fastdfs +tomcat 开机自启动

    在tomcat中新建一个可以启动的 .sh 脚本文件 /usr/local/tomcat7/bin/ export JAVA_HOME=/usr/local/java/jdk7 export PATH ...

  3. [jk]服务器远控卡及kvm切换器

    远控卡的需求 经常我们有这么一个需求,那就是某一台器服务器突然宕机,不能启动,而机房却在外地.解决这个问题的方法有两种,一是联系机房人员,二是通过idrac卡远程连接.我们必须根据事情的轻重缓急,来选 ...

  4. Vue知识点超快速学习

    基础知识: vue的生命周期: beforeCreate/created.beforeMount/mounted.beforeUpdate/updated.beforeDestory/destorye ...

  5. 【qt】QT 的信号与槽机制

    QT 是一个跨平台的 C++ GUI 应用构架,它提供了丰富的窗口部件集,具有面向对象.易于扩展.真正的组件编程等特点,更为引人注目的是目前 Linux 上最为流行的 KDE 桌面环境就是建立在 QT ...

  6. 【Qt】qt库结构及示例

    QT库结构 Qt图形库是一个组织严谨的C++类库,其结构如图所示 细说Qt库 Qt类库中包含了上百个类,结构十分复杂,上图展示了Qt_3.2类库的基本结构. Qt类库中的类可以分成两种类型: 一种是直 ...

  7. vue 的事件冒泡

    一.事件冒泡 方法一.使用event.cancelBubble = true来组织冒泡 <div @click="show2()"> <input type=&q ...

  8. uboot——之初体验

    官方下载地址:ftp://ftp.denx.de/pub/u-boot/ uboot的终极奥义就是启动内核. 但是,现在,我们先做最基本的,去官网下载一个支持自己板子的uboot,然后解压缩,打补丁. ...

  9. 基于jquery地图特效全国网点查看代码

    基于jquery地图特效全国网点查看代码.这是一款简单实用的jQuery地图特效,主要知识点是jquery和css实现了中图地图,提示层效果.效果图如下: 在线预览   源码下载 实现的代码. htm ...

  10. 算法篇---Shell排序(希尔)算法

    先取一个小于n的整数d1作为第一个增量,把文件的全部记录分成d1个组.所有距离为dl的倍数的记录放在同一个组中.先在各组内进行直接插入排序:然后,取第二个增量d2<d1重复上述的分组和排序,直至 ...