新增html元素的使用

今天学习HTML5中新增元素的使用

(Ⅰ)新增主体结构元素

Section元素:用于对网站或应用程序中的内容进行分块。

<section>

<h1></h1>

<p></p>

</section>

Article标签定义外部内容。

<article>

</article>

Time元素的使用

<p>

<time>

</time></p>

<p>

<time datetime=>

</time>

</p>

Ⅱ()新增非主体元素的使用

Header:是一种具有引导和导航作用的元素,通常用来放置整个页面或者页面内一个内容快标题。也包含表格,表单和相关logo图片。

<p id=”p1”>

<time datetime=”2013-3-13>

今天是2013年3月17日

</time>

</p>

<p id=”p1”>

<time datetime=”2013-3-13T17:00>

今天是2013年3月17日晚上五点

</time>

</p>

Footer元素的使用

<footer>

<ul>

<li></li>

<li></li>

</ul>

</time>

Address元素的使用

用来在文档中呈现联系信息, 包括文档作者和文档维护者的名字。以及他们的网站链接,电子邮件地址,电话号码等。

<address>

<a href=”….”></a>

</address>

Ⅲ()新增其他元素的使用

Mark元素的使用。用来对网页中的文字进行渲染,是文字更突出。

<p>…<mark></mark>…</p>

Progress元素的使用,表示运行的进程。可以使用progress显示javascript中耗费的时间函数进程。还可以表示下载的百分比。

对象下载进度

<progress>

<span id=”obgprogress”>76</span>%

</prgoress>

Command元素的使用

<menu>

<command onclick=”alert(‘hello world!’)”>click me!</command>

</menu>

其他属性的使用:


属性


隶属性


意义


Reversed


Ol元素


制定列表倒序显示


Charset


Meta元素


为文档字符编码提供一种良好的方式


Type


Menu元素


让菜单可以以上下文菜单,工具条与列表菜单三种形式出现


Lable


Menu元素


为菜单定义一个可见的标注


Scoped


Style元素


用来规定样式的作用范围,比如只对某个数起作用


Async


Script元素


定义脚本是否异步执行


Manifest


Html元素


开发离线web应用程序时与api结合使用


Sand,srcdoc,seamless


Iframe元素


提高页面的安全性

时间: 2024-08-10 15:02:32

新增html元素的使用的相关文章

HTML5之新增的元素

今天打开博客看到自己有了一个小粉丝,说实话还是蛮开心的,坚持写博客大半年了,终于迎来了自己的第一个小伙伴.总算是坚持了那么久的事情看到了结果吧. 前几天参加了我们学院老师的比赛---<青年教师大赛的初赛>.我被我们老师拉去做了义工-----计时员.看了所有老师的比赛,虽然都特别好,但是让我印象深刻的还是一个HTMl5+CSS3的课程.看到那种炫酷的效果,我瞬间都被吸引住了.所以忙完了手头上的作业,就从别人那里要到了HTML5的教程,开始了我的学习HTML5之路.虽然看了6节课了,还是没有学到老

HTML5学习笔记(三):语义化和新增结构元素

在HTML5之前,使用机器来阅读一个网页是非常困难的,我们使用不同样式的div来标记不同的内容,所以实际上机器无法得知页面的哪个部分是正文,哪个部分是标题,那么在HTML5里,针对这个问题就引入了语义化的概念,同时提供了新的标签来指定对应的内容类型. 语义化的好处 语义化的html只用来搭建网页的结构,去掉css后,网页结构不会变: 屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页: 搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重: 你的页面是否对爬虫容易理解非常重要,因

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

jquery中动态新增的元素节点无法触发事件解决办法

在使用jquery中动态新增的元素节点时会发现添加的事件是无法触发的,我们下面就为各位来详细的介绍此问题的解决办法. 比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为“reply”,如果你用的是$(".reply").click(function(){ //do something... }),想必后面通过ajax加载进来的列表中的回复按钮,点击事件会失效. 其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点lo

谈谈html5新增的元素及其他功能

相信大家一开始学习web时看到html5就自然想到html,就算也没学过html,就好像听闻过小米2s就自然也熟悉小米3红米.不管是技术还是产品都是站在前辈的肩膀上发展起来的,正因此若是熟悉html,对于html5的学习就相当于在html这个容器里继续扔新的东西进去,哈哈哈,好像废话多了. 目前,web已经悄然引来html5的时代了,下面揭晓html5成功背后的面纱. 1.首先,html5语法发生了什么变化?! 1.1内容类型(祖宗不变) 扩展名:.html或htm 文件类型:text/html

浅谈HTML5之二:新增的元素和废除的元素

新增结构元素: section元素 section元素定义文档或应用程序中的一个区段,比如章节.页眉.页脚或文档中的其他部分.它可以与h1,h2,h3,h4,h5,h6元素结合起来使用,标示文档结构. HTML5中代码示例:<section>…</section> HTML4中代码示例:<div>…</div> article元素 article元素表示文档中的一块独立的内容,譬如博客中的一篇文章或报纸中的一篇文章. HTML5中代码示例:<artic

解决jquery中动态新增的元素节点无法触发事件的问题有两种解决方法

解决jquery中动态新增的元素节点无法触发事件的问题有两种解决方法,如下: 为了达到更好的演示效果,假设在某个页面的body下有以下结构的代码: ? 1 2 3 4 5 6 7 8 9 10 11 <p id="pLabel">新加一条</p> <ul id="ulLabel">  <li class="liLabel">aaa1</li>  <li class="li

HTML5中新增的元素

大家都知道HTML5是最新的版本,其中增加了很多老版本没有的新元素,下面就是归纳的新元素: article    定义外部内容,可以使外部的一篇文章或来自bolg的文本或者是来自论坛的文本 aside     定义article以为的内容,aside的内容应与article的内容相关 audio    定义声音,音频 canvas    定义图形,如图表或者其他图像 command     定义命令按钮,比如单选按钮,复选框或按钮 datails    用于描述文档或文档的某个细节,与summa

1.HTML5新增结构元素

HTML5新增结构元素: header元素表示页面中一个内容区块或整个页面的标题. section元素表示页面中的一个内容区块,比如章节.页眉.页脚或页面中的其他部分.它可以与h1.h2.h3.h4.h5./6等元素结合使用,标示文档结构. article元素表示页面中的一块与上下文不相关的独立内容,譬如博客中的一篇文章或报纸中的一篇文章. aside元素表示article元素的内容之外的.与article元素的内容相关的辅助信息. nav元素表示页面中导航链接的部分. footer元素报时整个