HTML（十一）、html5

最新推荐文章于 2022-10-29 09:40:56 发布

weixin_45552104

最新推荐文章于 2022-10-29 09:40:56 发布

阅读量147

点赞数

分类专栏： HTML静态页文章标签：前端

本文链接：https://blog.csdn.net/weixin_45552104/article/details/102552604

版权

HTML静态页专栏收录该内容

18 篇文章 0 订阅

订阅专栏

一、HTML的发展史
在这里插入图片描述
二、HTML5和HTML4的区别

1、更简单

2、标签的语义化

3、语法更宽松

4、多设备跨平台

5、自适应网页设计

三、文档类型声明(DTD)

DTD ( Document Type Definition )
H5
<!DOCTYPE html>

HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C// DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/frameset.dtd">

四、新增的HTML5标签

语义化标签
<header> 	头标签
<nav>	 	导航标签
<section> 	表示文档的结构、栏目
<footer>	页脚
<article>	文章标签
<aside> 	侧边栏导航
<mark>	凸显文字

在这里插入图片描述

figure
用来表示网页上一块独立的内容。

figcaption
用来表示figure的标题 
作为第一个或最后一个元素

output
显示表单元素结果。


datalist
提供表单选项列表

datalist.html



hgroup
<hgroup>
<h3></h3>
<h4></h4>
</hgroup>

dialog
会话框 默认隐藏绝对定位居中
Open 属性 非隐藏

embed 嵌入插件标签

video
定义视频，比如电影片段或其他视频流
*.mp4   *.ogg   *.webM
<source src="xx.ogg" type="audio/ogg">
audio
定义音频，比如音乐或其他音频流

canvas
画布

改良的ol

     a、可以自定义编号 start   
     b、可以按编号反向排序 reversed
     c、可以使用type=“A”

   例：
<ol start=3  >
    <li>aaaa</li>
    <li>aaaa</li>
    <li>aaaa</li>
</ol>


类型值     生成样式    	 序列举例    
 A             大写字母     	 A、B、C、D、E    
 a             小写字母    	 a、b、c、c、e    
 I              大写罗马数字      I、II、III、IV、V    
 i              小写罗马数字      i、ii、iii、iv、v    
1             阿拉伯数字     	1、2、3、4、5

五、删除的HTML标签

部分浏览器支持：
<marquee>
<applet>
<bgsound>
<blink>
完全抛弃：
<rb>
<acronym>
<dir>
<isindex>
<listing>
<xmp>
<nextid>

六、重新定义的HTML标签

<rb>		ruby
<acronym>	abbr
<dir>		ul
<isindex>	form与input相结合的方式替代
<listing>	pre
<xmp>		code
<nextid>	guids

七、智能表单的使用和规范

<input type="?" />
地址栏
<input type="url" >
输入无效地址会自动提示
输入数字	
<input  type="number" value="25" min="10" max="100" step="5"/>
step 跳跃数
min  最小值
max 最大值
输入电子邮件
<input type="email"  required="required" multiple="multiple" >
required 判断是否为空
multiple 可用逗号分隔邮件地址
拖动范围
<input type="range" value="25" min="0" max="100" step="5" >
(如果不设置最大最小值默认值为0与100)
获取颜色
<input type="color" value=""/>
(value默认是#000000  设置默认值必须是6个16进制数)
搜索框
<input type="search" value=""/>
电话输入框(语义话)

<input type="tel" value=""/>
日期年月日
<input type="date" value="yyyy-mm-dd"/>
日期年月
<input type="month" value="yyyy-mm"/>
日期年周
<input type="week" value="yyyy-W01"/>
时间 时分
<input type="time" value="hh:mm"/>
日期时间 年月日  时分
<input type="datetime-local"  value="yyyy-mm-ddThh:mm"/>
日期时间 谷歌都不兼容的日期控件 safari Opera12
<input type="datetime" />

关闭智能表单验证 ： novalidate=“false”
火狐关闭缓存：autocomplete=“off”

weixin_45552104

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML（十一）、html5

一、HTML的发展史二、HTML5和HTML4的区别1、更简单2、标签的语义化3、语法更宽松4、多设备跨平台5、自适应网页设计三、文档类型声明(DTD)DTD ( Document Type Definition )H5<!DOCTYPE html>HTML 4.01<!DOCTYPE HTML PUBLIC "-//W3C// DTD HTML 4....
复制链接

扫一扫

专栏目录