• HTML5与CSS3权威指南.pdf1


    第2章 HTML5与HTML4的区别

     HTML5的文件扩展符与内容类型保持不变仍为“.html”或“.htm”,内容类型(ContentType)仍为“text/html”

    DOCTYPE声明:

    HTML4中,<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    HTML5中,<!DOCTYPE html>(不区分大小写)

    另外,当使用工具时,也可以在声明中加入SYSTEM识别符

    <!DOCTYPE HTML SYSTEM "about:legacy-compat">

    指定字符编码

    HTML4,<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

    HTML5,<meta charset="utf-8">

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

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

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

    省略引号

    当属性值不包括空字符串 “<” “>” “=” 单引号 双引号等字符时,属性两边的引号可以省略

    <input type="text">

    <input type=text>

    新增的结构元素

    section元素,它表示页面中的一个内容区块,比如章节、页眉、页脚等部分

    article元素,表示页面中的一块与上下文不相关的独立内容

    aside元素,表示article元素外的相关的辅助信息

    header元素,表示一个内容区域或页面的标题

    hgroup元素,用于对内容区块的标题进行组合

    footer元素,表示整个页面或页面中一个内容区块的脚注,一般会包含作者的名字、创作日期等

    nav元素,表示页面中导航链接的部分

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

    新增的其他元素

    video元素,定义视频,比如电影片段

    audio元素,定义音乐或其他音频流

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

    mark元素,视觉上呈现需要高亮的文字

    progress元素,表示运行中的进程

    time元素,表示时间或日期

    ruby元素,表示ruby注释

    rt元素,表示字符的解释或发音

    rp元素,定义不支持ruby元素的浏览器所显示的内容

    wbr元素,软换行,与br元素的区别是,br指必须换行,wbr表示足够宽时,不必换行,宽度不够进行换行

    canvas元素

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

    detail元素,与summary元素(点击会显示细节信息)配合

    datalist表示可选数据列表,与input配合,制作输入值的下拉列表

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

    keygen元素来生成密钥

    output元素,表示不同类型的输出,比如脚本的输出

    source元素,为媒介元素(比如<video>)定义媒介资源

    menu元素,表示菜单列表

    新增的input元素类型

    email

    url

    number

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

    Date Pickers,提供选取日期和时间的新型输入文本框

    date-选取日、月、年

    month-选取月、年

    week-选取周、年

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

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

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

    废除的元素

    能用CSS替代的元素,纯粹为画面展示服务的,HTML5都废除了basefont big center font s strike tt u

    不再使用frame框架,frame框架对网页可用性存在负面影响,HTML5不支持frame框架,只支持iframe框架,废除frameset frame noframes

    新增的属性

    表单相关:

    可以对input(type=text) select textarea button元素指定autofocus属性,画面打开时自动获取焦点

    可以对input (type=text)与textarea元素指定placeholder属性,它会对用户的输入进行提示

    可以对input output select textarea button 与fieldset指定form属性,声明它属于哪个表单,然后将其放置在页面的任何位置

    可以对input(type=text)与textarea元素指定required属性,该属性在用户提交的时候进行检查(输入内容)

    为input元素增加了几个新的属性autocomplete min max multiple pattern 与step,同时还有一个新的list元素与datalist元素配合使用。datalist元素与autocomplete属性配合使用。multiple属性允许在上传文件时一次上传多个文件

    为input元素与button元素增加formaction formenctype formmetthod formnovalidate与formtarget,他们可以重载form元素的action、enctype、method、novalidate与target属性。为field元素增加了disabled属性,可以把它的子元素设为disabled(无效)状态

    为input元素、button、form增加novalidate属性,可以取消提交时进行的有关检查

    链接相关的属性

    为a与area元素增加media属性,该属性规定目标URL是为神马类型的媒介/设备进行优化,只能在href属性存在时使用

    为area元素增加hreflang属性与rel属性,以保持与a元素、link元素一致

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

    为base元素增加target属性,目的是保持与a元素的一致性

    其他属性

    为ol元素增加属性reversed,指定列表倒序显示

    为meta增加charset属性

    为menu元素增加两个新属性,type与label。label属性为菜单定义一个可见的标注,type属性让菜单可以以上下文菜单、工具条与列表菜单的三种形式出现

    为style元素增加scoped属性,规定样式的作用范围

    为script元素增加async属性,定义脚本是否异步执行

    为html元素增加属性manifest,开发离线Web应用程序时它与API结合使用,定义一个URL,在这个URL描述文档的缓存信息

    为iframe元素增加sandbox seamless srcdoc 提供页面的安全性

    废除的属性

    全局属性

    全局属性指得是可以对任何元素都使用的属性

    contentEditable属性,该属性的主要功能是允许用户编辑元素中的内容,该元素必须是可以获得焦点的元素,属性的值是一个布尔值,该元素拥有inherit状态(未指定属性值时,从父元素继承),此外还有一个isContentEditable属性检测是否可编辑

    designMode属性,用于指定整个页面是否可编辑,两个属性值“on”,“off”

    document.designMode="on";//IE8不允许;IE9允许;Chrome3和Safari内嵌frame可编辑;Firefox和Opera允许;

    hidden元素,类似input元素的hidden属性,功能是通知浏览器不渲染该元素,使该元素不可见,有两个值true和false

    spellcheck属性,针对input(type=text)与textarea这两个输入框提供一个新属性,对用户输入的文本内容进行拼写检查,有true和false两个值,需要注意的是,如果元素的readOnly属性或disabled属性设为true,则不执行拼写检查

    tabindex属性,当通过不断敲击Tab键让窗口或页面中的控件获得焦点,把元素的tabindex属性值设为-1可以取消该行为  本章完

  • 相关阅读:
    查找代码中的中文
    C# 清除cookies
    C# 32位程序在64位系统下注册表操作
    C# 32位程序在64位系统下运行中解决重定向问题
    C# 把一个文件夹下所有文件删除
    C# 把一个文件夹下所有文件复制到另一个文件夹下
    chromium浏览器开发系列第五篇:Debugging with WinDBG
    chromium浏览器开发系列第四篇:如何调试最新chromium源码
    chromium浏览器开发系列第三篇:chromium源码目录结构
    chromium浏览器高级开发系列第二篇:如何编译最新chromium源码
  • 原文地址:https://www.cnblogs.com/sdgjytu/p/3891134.html
Copyright © 2020-2023  润新知