H5+CSS3
1、 约等于HTML+CSS3+javascript+api(接口)
2、 新认识：
兼容性、实用性和用户优先
化繁为简
3、 文档类型声明：
<!doctypehtml>-------大写也可以
<html>
<head>
<meta charset=”utf-8”>-----字符编码设置
<title>网站标题</title>
</head>
<body>
</body>
</html>
4、 新增标签：（结构标签、双标记）
（1）<article></article>定义文章，一块独立的内容
（2）<header></header>定义一个页面或者一块区域的头部
（3）<nav></nav>定义导航链接
（4）<section></section>定义一块区域（对内容进行分块）-通常和标题h1---h6结合使用
（5）<aside></aside>定义页面内部的侧边栏
注意：<article>和<section>区别：
<article>定义整块，<section>强调分块。这两者可以互相嵌套使用
5、 使用新标签的网站整体布局：
例子：
<!--整个-->
<section>
<!--banner-->
<header>
<imgsrc="image/bgheader.jpg">
<div class="title">个人<span>的BLOG</span></div>
</header>
<!--导航-->
<nav>
<ul>
<li class="aNow"><a href="">博客首页</a></li>
<li><a href="">关于我</a></li>
</ul>
</nav>
<div class="main">
<!--左侧-->
<article>
<mark>晚上</mark>
<p> 早上起来脑袋都昏沉，直到现在都是。</p>
</article>
<!--右侧-->
<aside>
<ul>
<liclass="rNow"><a href="">日志</a></li>
<li><a href="">相册</a></li>
</ul>
</aside>
</div>
<!--底部-->
<footer>
版权归小鱼儿所有
<hr>
法律条文 联系我们 客户意见 商户合作
</footer>
</section>
6、 其他标签：
（1）<figqure></figqure>定义一组媒体内容及标题
（2）<figcaption></figcaption>定义figqure元素的标题（通常这两个联合使用）。例子：
<figqure>
<figcaption>标题</figcaption>
<dl>
<dt>老师：做完了吗？</dt>
<dd>学生：没有</dd>
</dl>
</figqure>
（3）<hgroup></hgroup>定义文件一个区块的信息（和h1—h6标题结合使用）。例子：
<hgroup>
<h1>关于我们</h1>
<h2>新闻中心</h2>
<h3>通知公告</h3>
<h4>案例分享</h4>
<h5>联系我们</h5>
</hgroup>
（4）<dialog></dialog>定义一对话框（和<dl><dt></dt><dd></dd></dl>一起使用）。例子：
<dialog>
<dt>老师：做完了吗？</dt>
<dd>学生：没有</dd>
</dialog>
（5）<mark></mark>突出显示或高亮显示的文字（默认显示黄的背景）--和h4中<span></span>效果一样。例子：
<mark>老师与学生的对话</mark>
（6）<details></details>表示点击获取更多信息，在中间加上<summary>标题</summary>配合使用；（兼容性不好）例子：
<details>
<summary>点击更多</summary>
<p>如果您的计算机或网络受到防火墙或者代理服务器的保护，请确认 Firefox 已被授权访问网络。</p>
</details>
扫一扫
5832
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
