HTML 5中的标记方法-阿里云开发者社区

开发者社区> webmirror> 正文

HTML 5中的标记方法

简介: 内容类型 (ContentType) 首先, HTML 5的文件扩展符与内容类型保持不变。也就是说,扩展符仍然为" .html" 或 ".htm" ,内容类型 (ContentType)仍然为 "text刷html" DOCTYPE声明 DOCTYPE声明是HTML文件中必不可少的,它位于文件第一行。
+关注继续查看

内容类型 (ContentType)

首先, HTML 5的文件扩展符与内容类型保持不变。也就是说,扩展符仍然为" .html" 或 ".htm" ,内容类型 (ContentType)仍然为 "text刷html"

DOCTYPE声明

DOCTYPE声明是HTML文件中必不可少的,它位于文件第一行。在HTML5中,刻意不使用版本声明,一份文档将会适用于所有版本的HTML. HTML 5中DOCTYPE声明方式是不区分大小写,引号不区分是单引 号还是双引号

指定字符编码

HTML4中:;HTML 5中,可以使用对元素直接追加charset属性的方式来指定字符编码,如: 两种方居都有效,不能同时使用。从HTML5开始,对于文件的字符编码推荐使用UTF-8

新增的元素和废除的元素

新增的结构元素

section:表示页面中的一个内容区块

article:表示页面中的一块与上下文不相关的强立内容

aside:表示article元素的内容之外的

header:表示页面中一个内容区块或整个页面的标题

bgroup:用于对整个页面或页面中一个内容区块的标题进行组合

footer:表示整个页面或页面中一个内容区块的脚注;一般会包含创作者的姓名、创作日期以及创作者联系信息

nav:表示页面中导航链接的部分

figure:表示一段独立的流内容,一般表示文档主体流内容中的一个独立单元。使用figcaption元素为figure元素组添加标题

新增的真他元素

video:定义视频

audio:定义音频

embed:用来插入各种多媒体,格式可以是Midi、Wav、AIFF、AU、MP3等

mark:主要用来在视觉上向用户呈现那些需要突出显示或高亮显示的文字

progress:表示运行中的进程,可以用progress元素显示JS中耗费时间的函数的进程

time:表示日期或时间,也可以同时表示两者

ruby:表示ruby注释(中文注音或字符)

rt:表示字符(中文注音或字符)的解释或发音

rp:在ruby注释中使用,以定义不支持ruby元素的浏览器所显示的内容

wbr:表示转换行。 wbr元素与br元素的区别是. br元素表示此处必须换行,而wbr的意思是浏览器窗口或父级元素的宽度足够宽时(没必要换行时),不进行换行,而当宽度不够时主动在此处进行换行。 wbr对字符型的作用挺大,但对中文貌似没多大用处

canvas:表示图形,比如图表和其他图像。这个元素本身没有行为,仅提供一块面布,但它把一个绘图API展现给客户端JavaScript

command:表示命令按钮, 比如单选按钮、复选框或按钮

details:表示用户要求得到且可以得到的细节信息,它可以与summary元素配合使用。summary元素应该是details元素的第一个子元素

datalist:表示可选数据的列表,与input元素配合使用,可以制作出输入值的下拉列表

datagrid:表示可选数据的列表,它以树形列表的形式来显示

keygen:表示生成密钥

output:表示不同类型的输出.比如脚本的输出

source:为媒介元素(比如

menu:表示菜单列表,当希望列出表单控件时使用核标签

新增的input元素的类型

email:表示必须输入E-maíl地址的文本输入框

url:表示必须输入URL地址的文本输入框

number:表示必须输入数值的文本输入框

range:表示必须输入一定范围内数字值的文本输入框

HTML5拥有多个可供选取日期和时间的新型输入文本框:

date一一选取日、月、年

month一一选取月、年

week一一选取周和年

time一一选取时间(小时和分钟)

datetime-一一选取时间、日、月、年 (UTC时间)

datetime-local一一选取时间、日、月、年(本地时间)

新增的属性

表单相关的属性

autofocus:以指定属性的方式让元素在画面打开时自动获得焦点

placeholder:提示用户可以输入的内容

form:声明属于哪个表单,然后将其放置在页面上任何位置而不是表单之内

required:表示在用户提交的时候进行检查,检查该元素内一定要有输入内容为input元素增加了几个新的属性:autocomplete、min、max、multiple、pattern、step。multiple属性允许在上传文件时一次上传多个文件

formaction、formenctype、formmethod、formnovalidate与formtarget:可以重载form元素的action、enctype、method、novalidate与target属性

novalidate:可以取消提交时进行的有关检查,表单可以被无条件地提交

链接相关属性

media:规定目标URL是什么类型的媒介/设备进行优化的,只能在href属性存在时使用

hreflang与rel:保持与a元素、link元素的一致

sizes:可以与icon元素结合使用(通过rel属性),该属性指定关联图标(icon元素)的大小

其他属性

reversed:指定列表倒序显示

charset:为文挡的字符编码的指定提供了一种比较良好的方式

type与label:label属性为菜单定义一个可见的标注,type属性让菜单以上下文菜单、工具条与列表菜单的三种形式出现

scoped:规定样式的作用范围,譬如只对页面上某个树起作用

async:定义脚本是否异步执行

manifest:开发离线Web应用程序时它与API结合使用定义一个URL,在这个URL上描述文挡的缓存信息

sandbox、seamless与srcdoc:用来提高页面安全性,防止不信任的Web页面执行某些操作

全局属性

contentEditable属性

contentEditable属性:允许用户编辑元素中的内容,是一个布尔值属性,可以被指定为true或false

该属性还有个隐藏的inherit(继承)状态,属性为true时元素被指定为允许编辑,属性为false时元素被指定为不允许编辑;未指定true或false则由inherit状态根据父元素来决定。
元素还具有一个isContentEditable属性,当元素可编辑时该属性为true,当元素不可编辑时该属性为false

designMode属性

designMode属性:用来指定整个页面是否可编辑

designMode属性只能在JS脚本里被编辑修改;该属性有两个值"on"与"off"。属性被指定为 "on" 时页面可编辑,被指定为 "off" 时页面不可编辑

hidden属性

H5中所有的元素都允许使用hidden属性,该属性功能是通知浏览器不渲染该元素,使该元素处于不可见状态。但是页面装载后允许使用JS脚本将该属性取消,取消后 该元素变为可见状态,同时元素中的内容也即时显示出来。Hidden属性是一个布尔值的属性,当设为true时元素不可见,当设为false肘元素可见

spellcheck属性

spellcheck属性是为对用户输入的文本内容进行拼写和语法检查,具有true或false两种值;但是它在书写时必须明确声明属性值为true或false。需要注意的是:如果元素的readOn]y或disabled设为true,则不执行拼写检查

tabindex属性

对窗口或页面中所有控件进行遍历时,每一个控件的tabindex表示该控件是第几个被访问到的。tabindex还有另外一个作用,把元素的tabindex值设为负数. (通常为-1)后,仍可以通过编程方式让元素获得焦点,但按下Tab键时该元素就不能获得焦点了,这在复杂的页面中或复杂的Web应用程序中是十分有用的

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
正则 去除html标记
//string regexstr = @"]*>"; //去除所有的标签 //@"]*?>.*?" //去除所有脚本,中间部分也删除 // string regexstr = @"]*>"; //去除图片的正则 // string regexstr = @""; //去除所有标签,只剩br // string regexstr = @"]*?>.
489 0
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
7825 0
正文获取摘要 去除html标记
 Function RegUrl(TheStr) Set RegEx = New RegExp RegEx.IgnoreCase =True regEx.Global = True'****这一句加上是全部替换,如果不加,只替换第一个 RegEx.
432 0
对HTML标准的思考 - 记解决H5随机显示简繁体汉字问题
# 遇到问题 上个月在开发淘票票专业版过程中,我们遇到了一个奇怪的问题: **H5容器里的汉字被显示为一些奇怪的样子**。 ![IMG_1653.png](http://ata2-img.cn-hangzhou.img-pub.aliyun-inc.com/2d037aa3fe48847b2063d22f56198774.png) ![IMG_1654.png](http://
2274 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
9549 0
HTML标签 -特殊字符|学习笔记
快速学习HTML标签 -特殊字符
19 0
HTML标签- 图像标签|学习笔记
快速学习HTML标签- 图像标签
24 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
6417 0
+关注
webmirror
Good good study, day day up
122
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载