html5新增元素

最新推荐文章于 2022-12-26 15:24:37 发布

我是顾昀峰

最新推荐文章于 2022-12-26 15:24:37 发布

阅读量151

点赞数 1

分类专栏： HTML+CSS

本文链接：https://blog.csdn.net/qq_42852004/article/details/90766701

版权

HTML+CSS 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<!---->

<!doctype html>
<html lang="en">
 <head>
 <!--charset表示引用了什么字符集合，UTF-8,保证页面不出现乱码-->
  <meta charset="UTF-8"> 
  <meta name="Generator" content="EditPlus®">
  <!---viewport视口，inital-scale初始化的缩放比例为1，最大缩放比例为1,user-scalabel=no用户不可以缩放-->
  <title>标题<title>
  <meta name="viewport" content="width=device-width,inital-scale =1.0,maximum-scale=1.0,user-scalable=no">
  <meta name="Author" content="guyunfeng">
  <meta name="Keywords" content="guyunfeng">
  <meta name="Description" content="guyunfeng">
  <title>Document</title>
  <style>
	.title{
		text-align:center;
		font-size:20px;
		font-weight:bolder;
	}
	ul{
		font-size:12px;
		text-align:left;
		width:200px;
		margin:0 auto

	}
  </style>
 </head>
 <body>
 <div>
 <!--HTML"文档"，描述文档的结果，有区域和大纲
 遵循HTML大纲，可以更好的让爬虫和机器识别整个网页
 关注HTML整体的结构和语义

 HTML版本变迁
 HTML4 =>基于SGML标记语言
 XHTML =>XML 更加严格(XML是可扩展的标记语言)
 HTML5已经成为推荐标准基于HTML4但是不属于XML和SGML，比XML宽松一些


 -->
	<p class="title">
	HTML基础知识
	</p>
 </div>
 <div>
 	<section>
		<h1>主标题</h1>
	</section>

 </div>
<!--html5语义上的增加-->
<div>
	<h2>html5新增语义</h2>
	<ul>
		<li>header/footer头部</li>
		<li>section/article区
		（article和section相比，article更加完整）
		</li>
		<li>nav 导航</li>
		<li>aside 不重要的内容</li>
		<li>em/strong强调取代html4中的i标签和b标签是样式元素，基于样式来写的元素</li>
		<li>
		i标签在html5中被保留下来，主要作为图标icon来使用
		</li>
	</ul>
</div>
 <!--html5新增区块-->
 <div>
 	<h2>html5新增区块</h2>
	<ul>
		<li>section 区块</li>
		<li>article 文章区块</li>
		<li>nav 导航栏</li>
		<li> aside 侧边栏</li>
	</ul>
	<article>
		文章内容
	<article>
	<section>
		区块
	</section>
	<nav>
		导航栏
	</nav>
	<aside>
		边栏
	<aside>
	
 </div>
 <!--表单增强-->
 <div>
	<h2>表单增强</h2>
	<ul>
		<li>
			日期，时间，搜素
		</li>
		<li>
			表单验证
			pattern（增加正则）
			min,
			max 

		</li>
		<li>
			placeholder 自动聚焦
		</li>

	</ul>
	<input type="search">
	<input type ="time">
	<input type="date">
 </div>

  
 </body>

</html>