HTML5新增标签及CSS3新增属性

一、h5新增标签

新增元素 说明
video 表示一段视频并提供播放的用户界面
audio 表示音频
canvas 表示位图区域
source 为video和audio提供数据源
track 为video和audio指定字母
svg 定义矢量图
code 代码段
figure 和文档有关的图例
figcaption 图例的说明
main 主内容区
time 日期和时间值
mark 高亮的引用文字
datalist 提供给其他控件的预定义选项
keygen 秘钥对生成器控件
output 计算值
progress 进度条
menu 菜单
embed 嵌入的外部资源
menuitem 用户可点击的菜单项
menu 菜单
template 声明是模块元素
section 独立内容区块,可以用h1~h6组成大纲,表示文档结构,也可以有章节、页眉、页脚或页眉的其他部分;
nav 导航条部分信息
aside 标签内容之外与标签内容相关的辅助信息
article 特殊独立区块,表示这篇页眉中的核心内容
footer/header

底部信息/头部信息

 

二、CSS3新增属性

css3被划分为模块,最重要的几个模块包括:选择器、框模型、背景和边框、文本效果、2D/3D 转换、动画、多列布局、用户界面

  • 选择器

  • 框模型

  • 背景和边框 
    border-radius、box-shadow、border-image、 
    background-size:规定背景图片的尺寸 
    background-origin:规定背景图片的定位区域 
    background-clip:规定背景的绘制区域
  • 文本效果(常用) 
    text-shadow:设置文字阴影 
    word-wrap:强制换行 
    word-break 
    css3提出@font-face规则,规则中定义了font-family、font-weight、font-style、font-stretch、src、unicode-range
  • 2/3D转换 
    transform:向元素应用2/3D转换 
    transition:过渡
  • 动画
  • @keyframes规则: 
    animation、animation-name、animation-duration等
  • 用户界面(常用) 
    box-sizing、resize 
    css3新增伪类 
    :nth-child() 
    :nth-last-child() 
    :only-child 
    :last-child 
    :nth-of-type() 
    :only-of-type() 
    :empty 
    :target 这个伪类允许我们选择基于URL的元素,如果这个元素有一个识别器(比如跟着一个#),那么:target会对使用这个ID识别器的元素增加样式。 
    :enabled 
    :disabled 
    :checked 
    :not

另附一些H5不再支持的标签:

1、acronym(建议abbr) : 定义首字母缩写

2、applet(建议object):  定义 applet

3、basefont(使用css控制)

4、big(使用css控制) :定义大号文本

5、center(使用css控制): 定义居中的文本

6、font(使用css控制)

7、strike(使用del) :定义加删除线的文本

8、tt(使用css控制): 定义打字机文本。

9、u(使用css控制) :定义下划线文本

10、frame(建议iframe): 定义子窗口(框架)。

11、frameset :定义框架的集

12、noframes  :定义 noframe 部分

13、dir :定义目录列表

14、xmp:定义预格式文本

15、isindex:定义单行的输入域


你可能感兴趣的:(HTML/CSS)