css类与伪类 .class:link{}

伪类选择器汇总伪类选择器有4种, 结构性伪类\UI伪类\动态伪类和其他伪类. 具体如下 结构性伪类选择器结构性伪类选择器它能够根据元素在文档中的位置选择元素, 这类元素都有个前缀":"1. 根元素选择器 只作用于html等底部标签.很少用 .. :root 2. 子元素选择器 子元素全选还要更细致 ul>li:first-child{ } 增加伪类first-child 第一个 ul>li:last-child{ } 增加伪类last-child 最后一个 ul>li

1.伪类的语法 selector:pseudo-class {property:value;} 对应的中文:选择器:伪类{属性:值:} 2.anchor伪类 1 <style type="text/css"> 2 /*anchor伪类的顺序是固定的,不变的*/ 3 /*未访问时的样式*/ 4 a:link{color: black;} 5 /*访问过后的样式*/ 6 a:visited{color: pink;} 7 /*鼠标划过时的样式*/ 8 a:hover{color

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 伪类(伪类选择器) 伪类:同一个标签,根据其不同的种状态,有不同的样式.这就叫做"伪类".伪类用冒号来表示. 比如div是属于box类,这一点很明确,就是属于box类.但是a属于什么类?不明确.因为需要看用户点击前是什么状态,点击后是什么状态.所以,就叫做"伪类". 静态伪类和动态伪类 伪类选择器分为两种. (1)静态伪类:只能用于超链接的

伪类分为两种:UI伪类 与 结构化伪类 UI伪类:a:link{}    a:hover{}   a:active{}  a:visited{} input[type='text']:focus{}    #title-one:target{} 结构化伪类:  table  tr:nth-child(even){}   //even---下标为偶数的子元素 table  tr:nth-child(odd){}   //odd---下标为奇数的子元素 table  tr:first-child{}

CSS中的类(class)是为了方便过滤(即选择)元素,以给这类元素添加样式,class是定义在HTML文档树中的. 但是这在一些情况下是不够用的,比如用户的交互动作(悬停.激活等)会导致元素状态发生变化,class对这些动态变化无能为力. 为此,CSS引入了伪类(pseudo-class)的概念用来支持根据文档树以外的信息来过滤元素的能力. 伪类是一个抽象类,本质上还是一个类,因此其主要作用仍然是用来选择元素而后设定具体的样式. 伪类的定义使用:单冒号加上名称,如 mydiv:hover. 伪

一.快速了解CSS :focus-visible伪类 :focus-visible伪类是非常年轻的一个伪类,目前仅Chrome浏览器标准支持,但足够了.如果你是一个深入用户体验的开发者,这个伪类会非常有用. :focus-visible伪类应用的场景是:元素聚焦,同时聚焦轮廓浏览器认为应该显示. 是不是很拗口?规范就是这么定义的.:focus-visible的规范并没有强行约束匹配逻辑,而是交给了UA(也就是浏览器).我们通过真实的案例来解释下这个伪类是做什么用的. 在所有现代浏览器下,链接元素

一.快速了解CSS :focus-visible伪类 :focus-visible伪类是非常年轻的一个伪类,目前仅Chrome浏览器标准支持,但足够了.如果你是一个深入用户体验的开发者,这个伪类会非常有用. :focus-visible伪类应用的场景是:元素聚焦,同时聚焦轮廓浏览器认为应该显示. 是不是很拗口?规范就是这么定义的.:focus-visible的规范并没有强行约束匹配逻辑,而是交给了UA(也就是浏览器).我们通过真实的案例来解释下这个伪类是做什么用的. 在所有现代浏览器下,链接元素

今天在看JS DOM编程的时候,看到关于网页的三位一体,其中说到由于伪类的存在,使得css可以根据用户触发的事件改变元素的呈现效果. 这本属于行为层的范围. 因为以前只会用,理解的不清晰,所以就查询了下到底什么是伪类. 转自蓝色理想:http://www.blueidea.com/tech/site/2006/4221.asp 在CSS中,模式(pattern)匹配规则决定那种样式规则应用于文档树(document tree)的哪个元素.这些模式叫着选择符(selector). 一条CSS规则(

伪类 伪类与类相似,但又没有类附加标签上.伪类分为UI伪类和结构化伪类. UI伪类 :link(将样式添加到未被访问的链接上) :visted(将样式已添加到访问的链接上) :hover(将样式添加到鼠标悬浮的元素上) :active(将样式添加到被激活的元素上) :focus(将样式添加到被选中的元素上) 结构化伪类 :first-child(将样式添加到第一个子元素上) :last-child(将样式添加到最后一个子元素上) 伪元素 伪元素是在文档中若有实无的元素. 主要有以下几种 :fir