服装网站开发项目计划书,最好的app开发公司,wordpress外贸效果,wordpress 调用代码一、HTML5新增结构元素 之前#xff0c;我们只能用万能的div标签#xff0c;并为其设置不同的id如header, footer, sidebar等来分别表达头部#xff0c;底部或者侧栏等。而现在代码编写者不再需要为id的命名费尽心思#xff0c;对于手机、阅读器等设备更有语义的好处。 HTM…一、HTML5新增结构元素 之前我们只能用万能的div标签并为其设置不同的id如header, footer, sidebar等来分别表达头部底部或者侧栏等。而现在代码编写者不再需要为id的命名费尽心思对于手机、阅读器等设备更有语义的好处。 HTML 5增加了新的结构元素来表达这些最常用的结构 section: 这可以表达书本的一部分或一章或者一章内的一节header: 页面主体上的头部。并非head元素footer: 页面的底部页脚可以是一封邮件签名的所在nav: 到其他页面的链接集合article: 诸如blog, 杂志纲要等之中的一条独立记录举个例子一个blog的首页用HTML 5写的话可以是这样 !DOCTYPE html html head titleHTML5 新增结构元素/title /head body header hgroup h1Page title/h1 h2Page subtitle/h2 /hgroup /header nav ul Navigation... /ul /nav section article header h1Title/h1 /header section Content... /section /article article header h1Title/h1 /header section Content... /section /article /section aside Top links... /aside figure img src.../ figcaptionChart 1.1/figcaption /figure footer Copyright © time datetime2010-11-082010/time. /footer /body /html 二、HTML5新增块级元素 aside: 定义页面内容之外的内容比如侧边栏figure: 定义媒介内容的分组以及它们的标题figcaption: 媒介内容的标题说明dialog: 定义对话会话aside可以用以表达注记、贴士、侧栏、摘要、插入的引用等诸如作为补充主体的内容。比如这样表达blog的侧栏 aside h3最新文章/h3 ul lia href# mce_href#文章标题/a/li /ul /aside/pre figure元素表示一个有说明的块级图片。比如 figure figcaptionPRC/figcaption legendFigure 1. JavaScript Alert Box./legend img alt图片可替换文本 srcimg.png mce_srcimg.png / /figure dialog元素用于表达人们之间的对话。在HTML 5中dt用于表示说话者而dd则用来表示说话者的内容。如 dialog dt悟空/dt dd什么是幸福/dd dt佛/dt dd我请你穿越这片田野去摘一朵最美丽的花但是有个规则你不能走回头路而且你只能摘一次。/dd /dialog 三、HTML5新增行内语义标签元素 mark: 定义有记号的文本time: 定义日期/时间meter: 定义预定义范围内的度量progress: 定义运行中的进度进程mark元素用来标记一些不是那么需要着重强调的文本。 p今天别忘记了买 mark牛奶/mark。/p time元素如其名用来表达时间。它需要一个datetime的特性来标明机器能够认识的时间如 pOn Saturdays, we open at time09:00/time./p pThe concert is time datetime2009-02-18next Wednesday/time./p pWe finally hit the road at time datetime2009-02-17T05:00-07:005am last Tuesday/time./p meter元素表达特定范围内的数值。可用于薪水、百分比、分数等。比如 p您的分数是 meter value88.7 min0 max100 low65 high96 optimum100B/meter. /p ul limeter25%/meter/li limeter1/4/meter/li limeter200 out of 800/meter/li limetermax: 100; current: 25/meter/li limeter min0 max100 value25/meter/li /ul dl dtWidth:/dt ddmeter min0 max200 value12 titlemillimeters173mm/meter/dd dtHeight:/dt ddmeter min0 max100 value2 titlemillimeters104mm/meter/dd /dl 可以使用 progress 标签来显示 JavaScript 中耗费时间的函数的进度。 对象的下载进度 progress span idobjprogress85/span% /progress 四、HTML5新增行交互性标签元素 details: 定义元素的细节datagrid: 定义树列表 (tree-list) 中的数据datalist: 定义选项列表menu: 定义菜单列表command: 定义命令按钮details用来表示一段具体的内容但是内容默认可能不显示通过某种手段如点击与legend交互才显示出来。这跟现在各种通过JavaScript隐藏一段内容在点击后才显示出来的做法有些类似。比如 1 details openopenThis document was written in 2010./details datagriddatagrid用来控制数据可以由用户或者脚本来更新比如 1 2 3 4 5 6 7 8 9 10 11 12 datagrid ol li(datagrid row 0)/li li(datagrid row 1) ol stylelist-style-type:lower-alpha; li(datagrid row 1,0)/li li(datagrid row 1,1)/li /ol /li li(datagrid row 2)/li /ol /datagrid datalist 标签定义选项列表。请与 input 元素配合使用该元素来定义 input 可能的值。datalist 及其选项不会被想显示出来它仅仅是合法的输入值列表。请使用 input 元素的 list 属性来绑定 datalist。 1 2 3 4 5 6 7 8 9 10 11 12 13 h4Example 1 (for HTML 5 browsers)/h4 p label Enter your favorite cartoon character:br / input typetext namefavCharacter listcharacters datalist idcharacters option valueHomer Simpson option valueBart option valueFred Flinstone /datalist /labelbr / /p h4Example 2 (for both legacy and HTML 5 browsers)/h4 menu 在HTML 2就存在了不过HTML 4把它废弃了。HTML 5废物利用并在期内加上command元素。autosubmit为true时表单控件改变时自动提交。label为菜单定义一个可见的标注type是表现的方式默认为list还有context和toolbar。 1 2 3 4 5 6 7 menu label菜单 typetoolbar autosubmittrue liinput typecheckbox /Red/li liinput typecheckbox /blue/li /menu menu command typecommandClick Me!/command /menu 五、HTML5新增行多媒体标签元素 video: 定义视频audio: 定义音频source: 媒介元素比如 video 和 audio定义媒介资源video标签定义视频比如电影片段或其他视频流 1 2 3 video src/video/pass-countdown.ogg width300 height150 controls pIf you are reading this, it is because your browser does not support the HTML5 video element./p /video audio标签定义声音比如音乐或其他音频流 1 2 3 audio srcsomeaudio.wav 您的浏览器不支持 audio 标签。 /audio 1 2 3 4 5 audio source src/music/good_enough.wma typeaudio/x-ms-wma source src/music/good_enough.mp3 typeaudio/mpeg pIf you are reading this, it is because your browser does not support the HTML audio element./p /audio 转http://project.qqworld.org/archives/650 转载于:https://www.cnblogs.com/liubingna/archive/2013/03/19/2969744.html
