首页 web前端 H5教程 html5基础标签(html5视频标签 html5新标签用法)_html5教程技巧

html5基础标签(html5视频标签 html5新标签用法)_html5教程技巧

May 16, 2016 pm 03:48 PM
html5基础

1、  声明的变化

2、  指定字符编码的变化,html5中建议使用utf-8

3、  Html5中允许

没有结束符,不算错误

4、  不允许写结束标记的有:area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr

5、  可以省略结束标记的元素有:li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th

6、  可以省略全部标记的元素有:html、head、body、colgroup、tbody

7、  之前属性值text是要有双引号的,现在也可以省略

8、 见html5标记示例

9、 新增的结构元素section:容器元素。章节、页眉、页脚,可以与h1、h2…结合起来用,标示文档结构。也可用于封装标题+内容,但是没有标题是不当的。当一个容器元素需要被直接定义样式活脚本定义行为时,推荐使用div,而非section。作用:对页面内容进行分块。不要与有着自己的完整的、独立的内容的article元素混淆。总结:①不要将section元素用作设置样式的页面容器,那是div元素的工作。②如果article元素、aside元素、或nav元素更符合使用条件,不要使用section元素。③不要为没有标题的内容区块使用section元素。

10、新增的结构元素article:块级元素。表示页面中的一块与上下文不像个的独立内容。强调独立性,section强调分段或分块,article强调独立性。

11、新增的结构元素aside:块级元素。表示article元素的内容职位的,与article元素内容相关的辅助内容。

12、新增的结构元素Header:块级元素。整个页面的标题。Header中至少要有一个heading(h1—h6)或hgroup元素或nav元素。

13、新增的结构元素hgroup:块级元素。用于对整个页面或页面中一个内容区块的标题进行组合。如果只有一个主标题,是不需要hgroup的。

14、新增的结构元素footer:块级元素。内容区块的脚注。

15、新增的结构元素address:行内元素。呈现文档联系信息,包括:作者、邮箱等等。

16、新增的结构元素nav:块级元素。导航链接。传统导航、侧边栏导航、页内导航、翻页导航。H5中不要用menu替代nav,menu元素是用一系列发出命令的菜单上,是一种交互性的元素。更确切的说是使用在web应用程序中的。

17、新增的结构元素figure:块级元素。一段独立的流内容,一般表示文档主题流内容的一个独立单元。使用figcaption元素为figure元素组添加标题。

18、新增元素video:定义视频的。

<br>

复制代码
代码如下:
<br><br>

19、新增元素audio:定义音频的。

<br>

复制代码
代码如下:
<br><br>

20、新增元素embed: 插入各种媒体,格式可以是midi、wav、aiff、au、mp3等。

21<br><br>

复制代码
代码如下:
<br>http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"> name="src" value="”borse.wav”/" /><br>

22、新增元素mark: 突出显示或高亮显示的文字。相当与span

23、新增元素progress:表示运行中的进程,显示javascript中消耗时间的函数进程。

<br>

复制代码
代码如下:
<br><br>

24、新增元素Time:表示日期和时间。

<br>

复制代码
代码如下:
<br><br>

H4中用span<br>25、新增元素ruby:表示ruby注释。韩han,h4中没有的

26、新增元素rt:表示字符的解释或发音

27、新增元素rp:在ruby中使用,以定义不支持ruby元素的浏览器所显示的内容。

28、新增元素wbr:表示软换行。与br的区别是br表示此处必须换行;而wbr是浏览器或者父级元素的宽度足够宽时,不进行换行,宽度不够时,主动在此处换行。Wbr对字符型语言作用挺大,但是对于中文,貌似没有多大的作用。H4中没有的。

29、新增元素Canvas:表示图形的。如:图表、图像。但是:这个元素本身没有行为。仅提供一块画布,把绘制api展现给客户端javascript,使脚本能够把绘制的东西绘制到这块画布上。

<br>

复制代码
代码如下:
<br> <br>

30、新增元素command:表示命令按钮。如:单选按钮、复选框、按钮。<br><br>

复制代码
代码如下:
<br><br>

html4中没有

31、新增元素details:表示Details用户要求得到并且可以得到的细节信息。可以与summary配合使用。Summary提供标题或图例。

<br>

复制代码
代码如下:
<br>
html5this ji a ddddd,you kdkdkdk about html5<br> <br>
<br>
<br> <br>32、新增元素datagrid:表示数据的列表。以树形列表的形式显示

33、新增元素keygen:表示生成密钥

34、新增元素output:表示不同类型的输出。如脚本

35、新增元素source:媒介元素。定义媒介资源。H4中用param

36、新增元素menu:表示菜单列表。<br><br>

复制代码
代码如下:
<br>
  • <br>

    h4中menu不被推荐使用。

    37、新增input元素类型email:表示必须输入e-mail的文本输入框。

    38、新增input元素类型url:表示必须输入url地址的

    39、新增input元素类型number:表示必须输入数值。

    40、新增input元素类型range:表示必须输入一定范围内数字值的

    41、新增input元素类型date pickers:h5中有多个可选取日期和时间的新型输入文本框。

    <br>

    复制代码
    代码如下:
    <br>Date--------------选取日、月、年<br>Month-----------选取月、年<br>Week------------选取周和年<br>Time-------------选取时间(小时和分钟)<br>Datetime-------选取时间、日、月、年(utc时间)<br>Datetime-local—选取时间、日、月、年(本地时间)<br>

    44、 <br>1) 废除元素:只有部分浏览器支持的元素:applet、bgsound(只有ie支持)、blink、marquee等元素。bgsound(只有ie支持)、marquee(只有ie支持),所以在h5中废除。applet—可由embed或object替代。Bgsound—可由audio替代。Marquee可由js编程方式替代。<br>2)标签 手册释义:用于对元素进行组合。 使用指引:多用于图片与图片描述组合:<br><br>

    复制代码
    代码如下:
    <br>
    <br> figure标签<br>
    这儿是图片的描述信息
    <br>
    <br>
    <br>3)标签 手册释义:定义菜单列表。当希望列出表单控件时使用该标签。 使用指引:使用于菜单类区块,用来定义菜单列表或菜单选项:<br><br>
    复制代码
    代码如下:
    <br><br> <br>
  • HTML 5
  • <br>
  • CSS
  • <br>
  • JavaScript
  • <br>
    <br>
    <br>
    登录后复制
    本站声明
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

    热AI工具

    Undresser.AI Undress

    Undresser.AI Undress

    人工智能驱动的应用程序,用于创建逼真的裸体照片

    AI Clothes Remover

    AI Clothes Remover

    用于从照片中去除衣服的在线人工智能工具。

    Undress AI Tool

    Undress AI Tool

    免费脱衣服图片

    Clothoff.io

    Clothoff.io

    AI脱衣机

    Video Face Swap

    Video Face Swap

    使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

    热工具

    记事本++7.3.1

    记事本++7.3.1

    好用且免费的代码编辑器

    SublimeText3汉化版

    SublimeText3汉化版

    中文版,非常好用

    禅工作室 13.0.1

    禅工作室 13.0.1

    功能强大的PHP集成开发环境

    Dreamweaver CS6

    Dreamweaver CS6

    视觉化网页开发工具

    SublimeText3 Mac版

    SublimeText3 Mac版

    神级代码编辑软件(SublimeText3)

    h5项目怎么运行 h5项目怎么运行 Apr 06, 2025 pm 12:21 PM

    运行 H5 项目需要以下步骤:安装 Web 服务器、Node.js、开发工具等必要工具。搭建开发环境,创建项目文件夹、初始化项目、编写代码。启动开发服务器,使用命令行运行命令。在浏览器中预览项目,输入开发服务器 URL。发布项目,优化代码、部署项目、设置 Web 服务器配置。

    H5页面制作究竟指什么 H5页面制作究竟指什么 Apr 06, 2025 am 07:18 AM

    H5 页面制作是指使用 HTML5、CSS3 和 JavaScript 等技术,创建跨平台兼容的网页。其核心在于浏览器解析代码,渲染结构、样式和交互功能。常见技术包括动画效果、响应式设计和数据交互。为避免错误,应使用开发者工具调试;而性能优化和最佳实践则包括图像格式优化、减少请求和代码规范等,以提高加载速度和代码质量。

    h5怎么制作点击图标 h5怎么制作点击图标 Apr 06, 2025 pm 12:15 PM

    制作 H5 点击图标的步骤包括:在图像编辑软件中准备方形源图像。在 H5 编辑器中添加交互性,设置点击事件。创建覆盖整个图标的热点。设置点击事件的操作,如跳转页面或触发动画。导出 H5 文档为 HTML、CSS 和 JavaScript 文件。将导出的文件部署到网站或其他平台。

    H5指的是什么?探索上下文 H5指的是什么?探索上下文 Apr 12, 2025 am 12:03 AM

    H5referstoHTML5,apivotaltechnologyinwebdevelopment.1)HTML5introducesnewelementsandAPIsforrich,dynamicwebapplications.2)Itsupportsmultimediawithoutplugins,enhancinguserexperienceacrossdevices.3)SemanticelementsimprovecontentstructureandSEO.4)H5'srespo

    什么是H5编程语言? 什么是H5编程语言? Apr 03, 2025 am 12:16 AM

    H5不是独立编程语言,而是HTML5、CSS3和JavaScript的集合,用于构建现代Web应用。1.HTML5定义网页结构和内容,提供新标签和API。2.CSS3控制样式和布局,引入动画等新特性。3.JavaScript实现动态交互,通过DOM操作和异步请求增强功能。

    H5页面制作是前端开发吗 H5页面制作是前端开发吗 Apr 05, 2025 pm 11:42 PM

    是的,H5页面制作是前端开发的重要实现方式,涉及HTML、CSS和JavaScript等核心技术。开发者通过巧妙结合这些技术,例如使用&lt;canvas&gt;标签绘制图形或使用JavaScript控制交互行为,构建出动态且功能强大的H5页面。

    H5页面制作适合哪些应用场景 H5页面制作适合哪些应用场景 Apr 05, 2025 pm 11:36 PM

    H5(HTML5)适合应用于轻量级应用,如营销活动页面、产品展示页面和企业宣传微网站。它优势在于跨平台性和丰富的交互性,但局限性在于复杂的交互和动画、本地资源访问和离线功能。

    h5怎么制作弹窗 h5怎么制作弹窗 Apr 06, 2025 pm 12:12 PM

    H5 弹窗制作步骤:1. 确定触发方式(点击式、时间式、退出式、滚动式);2. 设计内容(标题、正文、行动按钮);3. 设置样式(大小、颜色、字体、背景);4. 实现代码(HTML、CSS、JavaScript);5. 测试和部署。

    See all articles