十、新的HTML5的API
- (Application Programming Interface)--应用程序编程接口
- HTML Geolocation 地理位置
- HTML Drag & Drop拖放
- HTML Local Storage 本地存储
- HTML Application Cache 应用程序缓存
- HTML Web Workers web工作者
- HTNL SSE
十一、浏览器的支持度
- 所有现代浏览器都支持HTML5
- 另外,对于新旧浏览器,无法识别的元素,作为内联自动处理
十二、语义元素转换为块元素:
- HTML5新定义了8个新的语义化元素,全都是块元素
- 如果像确保新老浏览器都支持,我们可以手动设置CSS样式
header, section, footer, aside, nav, main, article, figure {
display: block;
}
十三、可以自定义标签名字
<style>
display: block;
400px;
height: 300px;
background: lightpink;
margin-left: 100px;
margin-top: 100px;
font-size: 30px;
text-align: center;
line-height: 300px;
color: green;
</style>
<body>
<aaa> //随便取的标签名字,你开心不就好啦~
你好,我是Amelia
</aaa>
</body>
高能预警:傻缺IE8(及以前)不允许未知元素
- HTML5Shiv是一个针对 IE 浏览器的 HTML5 JavaScript 补丁,目的是让 IE 识别并支持 HTML5 元素。
- HTML5Shiv包裹在<head>元素里,
- 是一个js外部文件
- 在使用HTML5新元素就可以引入它了
<head>
// 下面是HTML的条件注释判断。只给懂的人...呸、浏览器看
<!--[if lt IE 9]>
<script src="/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<!-- HTML5标签-->
<section>
<h1>Famous Cities</h1>
<article>
<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</article>
</section>
</body>
十四、HTML5删除/废弃不能用的元素
删除的元素 | 被以下替代 |
<acronym> 首字母缩写 |
<abbr> |
<applet> |
<object> |
<basefont> 页面上默认字体颜色和字号 |
CSS样式 |
<big> 更大的文本 |
CSS样式 |
<center> 文本水平居中 |
CSS样式 |
<dir> 目录列表 |
CSS样式 |
<font> 字体外观,尺寸,颜色 |
CSS样式 |
<frame> 定义子窗口 |
<frameset> 定义框架集 |
<noframes> 向浏览器显示无法处理框架的提示文本,位于frameset元素中 |
<strike> 文本添加删除线 |
CSS样式,<s>或<del> |
<tt> 定义打字机文本 |
CSS样式 |
<acronym title="World Wide Web">WWW</acronym> //换成了abbr
<basefont color="red" size="5" /> //CSS样式替代
<frame></frame>
<frameset></frameset> //该标签对网页可用性的负面影响
十五、其他细节
- 闭合标签,双标签不写那个闭合的标签不会出现解析错误,但是建议闭合
<section>
<p>This is a paragraph. //没有</p>
<p>This is a paragraph.
</section>
- 单标签元素建议加 /来闭合;但在XHTML和XML文档中是必须要加的
<meta charset="utf-8">
<meta charset="utf-8" /> //两个都行
- HTML5元素命名 & class等属性名允许混合使用大写和小写字母,但建议用小写
- 1.混合使用本身就不符合命名习惯
- 2.视觉更干净
- 3.小写更容易编写
- 引号括起来的属性现在允许去掉,下面的例子都不会报错,
<table class="striped"> //建议用
<table class="striped"> //不建议用
<table class="table" striped> //更不建议用
- 在HTML5标准里,<html>,<body>,<header>标签甚至是可以省略的,但不建议哦~
<!DOCTYPE html>
<head>
<title>Page Title</title>
</head>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
- HTML5通过meta标签达到监听并适配设备屏幕的布局
<meta name="viewport" content="width=device-width, initial-scale=1.0">
* 当URL没有指定文件名时(比如:https://www.w3schools.com/css/),服务器将返回默认的文件名,通用的默认文件名是:index.html、index.htm、default.html、和default.html
* 但如果你的服务器仅配置了“index.html”作为默认文件名,那么你的文件就必须命名index.html,不能用index.htm
* 不过服务器可以配置多个默认的文件名,所以你可以根据需要设置多个默认文件名
* 总而言之,HTML文件的完整扩展名是.html,我们没有理由不用它啊~~~