1-HTML5初识

HTML5简介
HTML5是新一代的HTML。目前,主要应用在手机端,在PC端最新浏览器已经开始支持了。但还不全面。
HTML5是由W3C和WHATWG合作的结果。
WHATWG应用程序工作组,是由Firefox、chrome、Safari、IE等浏览器公司成立的一个机构。主要面向应用程序的完善和开发表单的扩展和完善。如:
  • 在HTML5中使用<video>标记,直接播放视频。
  • <input type=“email” name=“email” />,邮箱验证

改进
文档类型定义
HTML5中的文档类型定义:<!DOCTYPE html>。就连IE6都支持此文档类型。

网页字符集设置
<meta charset= “utf-8 ">

页面结构标记
由于<div>和<span>没有实际意义,就推出了以下标记,效果和<div>一样,但貌似见名知意
  • <header></header>网页头部
  • <nav></nav>导航栏,菜单栏
  • <footer></footer>页脚

文章相关标记:和div效果一样
  • <article>:代表一篇文章
  • <section>:划块。用于排版
  • <aside>:侧边栏
  • <details>:一个标题的简介
  • <summary>:标题的内容,配合details使用

其他标记:
  • <mark>:重点标注
  • <progress>:进度条
    • max:最大值
    • value:当前值

音频标记<audio>
  • 语法格式:<audio>xxx</audio>
  • 常用属性:
    • controls:是否显示控制面板
    • autoplay:是否自动开始
    • src:文件路径。支持格式(MP3、Ogg、WAV)
    • loop:是否循环
视频标记<video>
  • 语法格式:<video>xxx</video>
  • 常用属性:
    • controls:是否显示控制面板
    • autoplay:是否自动播放
    • src:视频路径。支持格式(Ogg、MP4)
    • loop:是否循环
    • width:宽度
    • height:高度
    • poster:第一帧的画面。默认是视频的第一帧。可以设置图片路径作为第一帧。

表单新增属性
  • autocomplete:自动完成,取值:on或off,类似历史记录
  • autofocus:自动获取焦点

表单input元素type属性的值
  • Tel:电话验证
  • email:邮箱验证
  • URL:网址验证,必须协议打头
  • color:颜色选择器
  • date:日历
  • month:选择月份
  • time:时间
  • datetime:日期时间
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值