元素的每个
元素。 \x0d\x0a:last-of-typep:last-of-type选择属于其父元素的最后
元素的每个
元素。\x0d\x0a:only-of-typep:only-of-type选择属于其父元素唯一的
元素的每个
元素。\x0d\x0a:only-childp:only-child选择属于其父元素的唯一子元素的每个
元素。\x0d\x0a:nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个
元素。 \x0d\x0a:nth-last-child(n)p:nth-last-child(2)同上,从最后一个子元素开始计数。\x0d\x0a:nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个
元素的每个
元素。 \x0d\x0a:nth-last-of-type(n)p:nth-last-of-type(2)同上,但是从最后一个子元素开始计数。 \x0d\x0a:last-childp:last-child选择属于其父元素最后一个子元素每个
元素。 \x0d\x0a:root:root选择文档的根元素。 \x0d\x0a:emptyp:empty选择没有子元素的每个
元素(包括文本节点)。 \x0d\x0a:target#news:target选择当前活动的 #news 元素。\x0d\x0a:enabledinput:enabled选择每个启用的 元素。 \x0d\x0a:disabledinput:disabled选择每个禁用的 元素 \x0d\x0a:checkedinput:checked选择每个被选中的 元素。 \x0d\x0a:not(selector):not(p)选择非
元素的每个元素。\x0d\x0a::selection::selection选择被用户选取的元素部分。
1、动态伪类选择器
不同的状态,使用不同的样式。
E: link
E: visited
E: active
E: hover
E: focus
2、目标伪类选择器
用来匹配页面的URI中某个标识符的目标元素。
E: target
选择匹配E的所有元素,且匹配元素被相关URL指向。
3、语言伪类选择器
用来匹配使用指定语言的元素。
E: lang(language)
4、元素状态伪类选择器
当元素处于某种状态下时,才起作用,在默认状态下不起作用。
E: checked
eg: input[type="checkbox"]:checked{}
E: enabled
eg: input[type="text"]:checked{}
E: disabled
eg: input[type="text"]:disabled{}
5、结构伪类选择器
这个就比较多了,平时用的也比较频繁。
: nth-child
: nth-last-child
: nth-of-type
: nth-last-of-type
: first-child
: last-child
: only-child
: first-of-type
: last-of-type
: only-of-type
: root 匹配元素所有在文档的根元素
: empty 选择没有子元素的元素,且不包含节点
6、否定伪类选择器
E: not(F) 匹配所有除F外的E元素
h5是html的最新版本,是14年由w3c完成标准制定。增强了,浏览器的原生功能,减少浏览器插件(eg:flash)的应用,提高用户体验满意度,让开发更加方便。
- 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
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