伪类分为两种：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{} ...
× 目录 [1]锚点 [2]UI元素 [3]结构伪类 [4]其他 前面的话 伪类经常与伪元素混淆，伪元素的效果类似于通过添加一个实际的元素才能达到，而伪类的效果类似于通过添加一个实际的类来达到。实际上css3为了区分两者，已经明确规定了伪类用一个冒号来表示，而伪元素则用两个冒号来表示。本文将详细介绍伪类的详细知识 锚点 关于锚点，有常见的5个伪类，分别是:link,:hover,:active,:...
直接上源码：```html 使用CSS3美化按钮 body { padding-top: 50px; } .download-info { text-align: center; } /* 默认状态下的按钮效果 */ .btn { background-color: #0074cc; *background-color: #0055cc; /* IE6,7 */ /* CSS3渐变制作背景图片 */ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0055cc)); background-image: -...
E:first-child解释：E的父元素的第一个子元素正好是E，给这个E定义样式 E:last-child解释：E的父元素的最后一个子元素正好是E，给这个E定义样式 E:only-child解释：E的父元素只有一个子元素，这个正好是E，给这个E定义样式 E:empty解释：E元素没有子元素和文本内容，给这个E定义样式 例子：只要E元素是它的父级的第一个子元素，就选中。它需要同时满足两个条件，一个是“第一个子元素”，另一个是“这个子元...
CSS3 target 伪类不得不说那些事儿（纯CSS实现tab切换） 是不是觉得target有点眼熟?! 今天要讲的不是HTML的标签里面有个target属性。 target伪类是css3的新属性。 说到伪类，对css属性的人肯定都知道:hover、:link、:visited、:focus等等，target用法跟他们是同出一辙的。 官方定义是： URL 带有后面跟有锚名称 #，指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。...
标签： CSS：#txt_search:focus{ border:1px solid #FFA00; background-image:url('img/icon-search-s.png'); background-color:Yellow;color:Red;} input获取焦点时只有color和background-color能被改变，而border和background-image则没有改变,这是为什么？虽然JQ的.focus()可以完成这个动作，但是我还是觉得用CSS伪类代码更美观，而且很好奇，为何CSS会选择性的只能改变个别属性。求大神解答 ...
jQuery JavaScript after 比如定义了以下CSS，添加伪类after .test:after{ content:'i am after'; height:20px; } 再写了个DIV hello world DIV里面显示的内容变成了 hello worldi am after 而$('.test :first').html()显示的依然是hello world，用firebug查看也是helloworld。请问各位大神要怎样才能获...
本帖最后由 belearner 于 2013-02-21 11:03:25 编辑 css http://www.w3school.com.cn/css/pr_pseudo_after.asp的代码是：此样式会在每个 h1 元素之后播放一段声音：h1:after { content:url(beep.wav); } 测试插入图片和文字是成功的。 我把某个wav格式的音频复制到网页目录，用相对路径调用的，没有成功。然后我在网上找了一段MP3音乐连接，也没有成功。请教大侠们：这是怎么回事？ 回复讨论(解决方案) 注释：...
伪类 伪类与类相似，但又没有类附加标签上。伪类分为UI伪类和结构化伪类。 UI伪类 :link(将样式添加到未被访问的链接上) :visted(将样式已添加到访问的链接上) :hover(将样式添加到鼠标悬浮的元素上) :active(将样式添加到被激活的元素上) :focus(将样式添加到被选中的元素上) 结构化伪类 :first-child(将样式添加到第一个子元素上) :last-child(将样式添加到最后一个子元素上...
/index.php"> M_UserName; ?> /index.php">会员中心 ">我的空间 /guestbook_admin.php">我的留言 /mystow.php">我的收藏 /article_add.php">发表文章 /myfriend.php">好友管理 /visit-history.php">访客记录 /search.php">查找好友 /index_do.php?fmdo=login&dopost=exit">退出登录 css: .pr{position:relative;...
在CSS3之前,我们在处理输入框的判断输入是否正确时,都会做相应的输入样式来提醒用户输入的正确性.而CSS3中已经增加了这一特性,valid和invalid这两个伪类.这两个主要作用在input输入框上. 我们来看看一个提交建议的实例界面很简单主要是: 结构代码里,用户名是必须要输入的,email是可选的,建议内容字符在4到20个字符之间(这里配合的pattern属性的用法). 我们接着写出CSS代码,其实就是改变其输入...
首先来看为w3c给他们的定义： 伪类：用于向某些选择器添加特殊的效果； 伪元素：用于将特殊的效果添加到某些选择器。 。。。。。等于没说！ 为了区分伪类和伪元素： 伪元素和伪类之所以这么容易混淆，是因为他们的效果类似而且写法相仿，但实际上 css3 为了区分两者，已经明确规定了伪类用一个冒号来表示，而伪元素则用两个冒号来表示。 下面用实例来区别两者的不同（用伪类 :first-child 和伪元...
CSS选择器大致可以分成5类：基本选择器，层次选择器，属性选择器，伪类，伪元素。基本，层次，属性选择器比较容易理解，毕竟它们选择的对象都属于DOM中看得见摸得着的元素。但伪类和伪元素相对比较抽象，稍微有一点点理解上的难度。本篇就是我对伪类和伪元素的理解。 先介绍一下伪类和伪元素有什么区别？其实这是个纯概念上的问题，就算不理解也不影响实际的使用。但作为一个CSSer，概念这种东西有时候就像地基，地基越牢固，将来...
CSS3中的伪类选择器例如:hover，:before，:after在已经在前端开发中被广泛使用，但是可能开发者还不太熟悉:checked这个伪类选择器。本文将介绍:checked这个伪类选择器以及如何使用它写出更加有优雅的代码。 :checked伪类选择器顾名思义，表示的是 type="checkbox" 的input元素被选中的状态。在前端开发中，我们常用:hover伪类来设置鼠标悬浮时的样式，而由于checked状态的改变需要用户进行点击操作，使用:checked伪类，我们则可...
前段时间在写网页的时候，使用了CSS的伪元素:after来实现样式，故而重温了一下伪类和伪元素。平时实现的时候便是拿出来用，但是真正区分两者的概念的时候却有点混淆了。首先，查看一下W3S对伪类和伪元素的定义：伪类：用于向某些选择器添加特殊效果。伪元素：向某些选择器设置特殊效果。对于我这种理解能力比较差的人来说，恕我直言，这两句话貌似……这是一个概念吧？从这两个概念，我们可以知道：1.二者都与选择器有着密不可分的...