- 浏览: 1524501 次
- 性别:
- 来自: 厦门
文章分类
- 全部博客 (516)
- Java (49)
- Java/Struts 2.0 (25)
- Java/Spring、Spring MVC (11)
- Java/Quartz (3)
- Java/Lucene (6)
- Java/Hibernate (19)
- Java/openJPA (7)
- Java/DWR (7)
- Java/Security、Spring Security/OAuth2 (6)
- Java/Threading (9)
- Java/XML (22)
- java/design pattern (4)
- Android (2)
- JavaScript (46)
- jquery (3)
- DB/MySQL (23)
- DB/Oracle (16)
- PHP (25)
- CSS (20)
- Linux (38)
- C/C++、DLL、Makefile、VC++ (31)
- 正则 (9)
- Eclipse (4)
- 安全、网络等概念 (25)
- 集群 (7)
- 网页 (5)
- 视频\音频 (1)
- HTML (6)
- 计算机数学/算法 (3)
- Virtualbox (1)
- LDAP (2)
- 数据挖掘 (6)
- 工具破解 (1)
- 其他 (13)
- Mail (1)
- 药材 (3)
- 游戏 (2)
- hadoop (13)
- 压力测试 (3)
- 设计模式 (3)
- java/Swing (2)
- 缓存/Memcache (0)
- 缓存/Redis (1)
- OSGI (2)
- OSGI/Gemini (0)
- 文档写作 (0)
- java/Servlet (3)
- MQ/RabbitMQ (2)
- MQ/RocketMQ (0)
- MQ/Kafka (1)
- maven (0)
- SYS/linux (1)
- cache/redis (1)
- DB/Mongodb (2)
- nginx (1)
- postman (1)
- 操作系统/ubuntu (1)
- golang (1)
- dubbo (1)
- 技术管理岗位 (0)
- mybatis-plus (0)
最新评论
-
pgx89112:
大神,请赐我一份这个示例的项目代码吧,万分感谢,1530259 ...
spring的rabbitmq配置 -
string2020:
不使用增强器 怎么弄?
OpenJPA的增强器 -
孟江波:
学习了,楼主,能否提供一份源代码啊,学习一下,十分感谢!!!4 ...
spring的rabbitmq配置 -
eachgray:
...
spring-data-redis配置事务 -
qljoeli:
学习了,楼主,能否提供一份源代码啊,学习一下,十分感谢!!!1 ...
spring的rabbitmq配置
利用伪类选择器和伪元素选择器,可以为文档中不一定具体存在的结构指定样式,或者为某些元素(甚至是文档本身)的状态所指示的幻像类指定样式。换句话说,会根据另外某种条件而非文档结构向文档中的某些部分应用样式,而且无法通过研究文档的标记准确地推断出采用何种方式应用样式。
伪类名 | 描述 |
:link | 指示作为超链接(即有一个href属性)并指向一个示访问地址的所有锚。注意,有些浏览器可能会不正地将:link解释为指向任何超链接,包括已访问和未访问的超链接。 |
:visited | 指示作为已访问地址超链接的所有锚。 |
动态伪类:
伪类名称 | 描述 |
:focus | 指示当前用有输入焦点的元素,也就是说,可以接受键般输入或者能以某种方式激活的元素。 |
:hover | 指示鼠标指针停留在哪个元素上,例如,鼠标指针可能停留在一个超链接上,:hover就会指示这个超链接。 |
:active | 指示被用户输入激活的元素,例如,鼠标指针停留在一个超链接上时,如果用户点击鼠标,就会激活这个超链接,:active将指示这个超链接。 |
类似于:link和:visited,这些伪类最常用于超链的上下文中。很多web页面都有类似的样式:
a:link{color:navy}
a:visited{color:gray}
a:hover{color:red}
a:active{color:yellow}
前两个规则使用静态伪类,后两个利用动态伪类。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>链接伪类</title> <style type="text/css"> /* unvisited links are blue*/ a:link{ color:blue; } /* visited links are purple*/ a:visited{ color:purple; } input:focus{ background:silver; font-weight:bold; } textarea:focus{ background:silver; font-weight:bold; } </style> </head> <body> <a href="#">link</a><br/> <input type="text" name="text1"/><br/> <textarea name="textarea1"></textarea> </body> </html>
显示效果:
发表评论
-
clear在CSS中的妙用
2009-12-24 21:53 1823在DIV + CSS设计网页中,经常需要设置多个DIV并列排 ... -
多浏览器测试的利器-IETester,自带IE5.5,IE6,IE7,IE8等多个内核.
2009-11-05 10:26 2112辛苦做出来的一个网站,到别人的电脑上显示得乱七八糟的,为啥?就 ... -
CSS IE 和 Firefox 的区别
2009-11-05 10:13 1453前言罗唆(其实很多时候没有区别,只是我们没弄好就变成区别了) ... -
第6章 文本属性==>文本缩进 P141
2009-06-05 22:27 962line-height 属性是指文本基线之间的距离,而不是字体 ... -
第6章 文本属性==>文本缩进 P135
2009-05-24 19:55 1240通过使用text-index属性,所有元素的第一行都可以缩进一 ... -
第5章 字体
2009-05-24 19:30 1237字体加粗:font-weight=>值:normal | ... -
第3章 结构和层叠 => 特殊性(优先级) P69
2009-05-03 07:40 1126对于每个CSS规则,用户代理(浏览器)会计算选择器的特殊性,并 ... -
CSS 样式学习库
2009-04-30 23:06 1002CSS菜单库 http://www.dynamicd ... -
第2章 选择器 =>选择相邻兄弟元素P56
2009-04-30 22:28 1608假设你希望对一个标题 ... -
第2章 选择器 =>特定属性选择类型 P49
2009-04-27 00:19 997<!DOCTYPE html PUBLIC " ... -
第2章 选择器 =>属性值选择器 P46
2009-04-26 23:05 1005属性值 选择器 除了可以选择有某些属性的元素 ... -
第2章 选择器 =>简单的属性选择器 P44
2009-04-26 22:53 1271如果希望选择有某个属笥的元素,而不论该属性值是什么,可以使用一 ... -
第2章 选择器 =>多类选择器 P41
2009-04-26 22:45 1355现在假设希望class为warni ... -
第2章 选择器 =>类选择器 P39
2009-04-26 11:39 949<!DOCTYPE html PUBLIC " ... -
第2章 选择器 =>选择器分组 P34
2009-04-26 11:03 962<!DOCTYPE html PUBLIC " ... -
第2章 选择器 =>选择子元素 P54
2009-04-26 10:37 1309<!DOCTYPE html PUBLIC " ... -
第1章 CSS和文档局 => @import指令
2009-03-12 22:51 1129与link类似,.@import用于指示WEB浏览器加载一个外 ... -
第1章 CSS和文档局 => link标记 P19
2009-03-12 21:51 1152对于<link>标签的属性详解: ... -
CSS入门4:css选择符
2008-08-11 14:58 823一.选择符模式 模式/含义/内容描述 * 匹 ...
相关推荐
本文介绍了CSS中多种类型的选择器,包括类与ID选择器、元素选择器、属性选择器、伪类和伪元素等。通过这些选择器,我们可以精确控制页面的布局和样式,实现复杂的设计效果。掌握这些选择器是成为优秀前端开发人员的...
`:first-child`和`:last-child`选择器分别用于选择父元素的第一个子元素和最后一个子元素。`:first-child`可以用于给列表项的第一项添加特别样式,`:last-child`则可以用于在列表或其他元素结尾添加特殊效果。 `:...
描述:选择每个`<p>`元素为其父元素的第二个子元素、最后一个子元素、第n个子元素等。 ##### 7. 其他选择器 - **否定选择器**:`:not(selector)` 示例:`:not(p)` 描述:选择不是`<p>`元素的所有其他元素。 - ...
CSS伪类是CSS中一种特殊的选择器类型,它们由CSS规范定义并被支持CSS的浏览器自动识别。通过使用这些伪类,开发者能够针对元素的不同状态或者上下文环境应用特定的样式规则。这种机制极大地增强了CSS的表现力和灵活...
二、多元素的组合选择器 多元素的组合选择器用来选择多个元素。有以下几种: * 多元素选择器(E,F):同时匹配所有 E 元素或 F 元素 * 后代元素选择器(E F):匹配所有属于 E 元素后代的 F 元素 * 子元素选择器...
可以明确两点,第一两者都与选择器相关,第二就是添加一些“特殊”的效果。这里特殊指的是两者描述了其他 css 无法描述的东西。 伪类种类 伪元素种类 区别 这里用伪类 :first-child 和伪元素 :first-letter 来进行...
CSS选择器分为几个类别,包括标签选择器、类选择器、ID选择器、属性选择器以及伪类和伪元素选择器。常规选择器主要涵盖这些基础类别。 1. **标签选择器**:通过HTML元素的标签名来选择元素,如`p`、`div`或`h1`等。...
结构性伪类选择器用于根据元素在文档树中的位置来选择元素。 1. **子元素选择器**:`div > p`。选择作为`<div>`的直接子元素的所有`<p>`元素。 2. **相邻兄弟选择器**:`li + li`。选择紧接在另一个`<li>`元素后的`...
在本章中,我们将深入探讨CSS(层叠样式表)选择器的下半部分,这是Web开发中的关键元素,用于控制网页的布局和样式。CSS选择器是用于选取HTML或XML文档中元素的规则,以便应用样式。理解并熟练掌握各种CSS选择器...
CSS(层叠样式表)是网页设计中用于控制布局和样式的语言。...理解并熟练运用这些伪类和伪元素以及高级选择器,能够大大提高CSS的编写效率和代码的可维护性。在实际的网页设计和开发中,掌握这些技术是至关重要的。
例如,“div,p”将同时选择所有的<div>和<p>元素。 3. 后代选择器(elementelement): - 用于选择元素内部的元素。例如,“divp”会选择所有位于<div>内部的<p>元素。 4. 子选择器(element>element): - 选择...
<p class="style2"><em>第二</em>段样式为style123</p> </body> </html> ``` 在这个例子中,`p.style1 em`表示选择所有具有`class="style1"`的`<p>`元素内部的`<em>`元素,并将其文字颜色设为蓝色。 **应用场景:*...
最后,伪类和伪元素选择器允许我们在元素的不同状态或特定部分上应用样式。例如,`:hover` 伪类用于当鼠标悬停在元素上时,`:first-child` 伪类选择父元素的第一个子元素,而 `::before` 和 `::after` 伪元素则可以...
- `:nth-child(odd)` 和 `:nth-child(even)`:这些伪类选择器分别应用于其父元素中索引为奇数和偶数的子元素。这在创建交替颜色效果时非常有用。 示例代码: ```css .test:nth-child(odd) { color: Blue; } ...
1. **组合器选择器**:包括`descendant`(空格分隔,选择子孙元素),`child`(>`符号,选择直接子元素),`adjacent sibling`(+号,选择紧邻的同级元素)和`general sibling`(~号,选择任意后面的同级元素)。...
### CSS 伪类全解析:深入探索选择器的隐藏力量 **CSS(Cascading Style Sheets,层叠样式表)**是一种用于描述网页元素样式的语言。它允许网页设计师和开发者控制网页的布局、颜色、字体和其他视觉方面的特性。...
3. 内容伪元素选择器:如`::first-line`(每个元素的第一行)、`::before`(每个元素的内容之前)、`::after`(每个元素的内容之后)。 四、jQuery选择器 1. 基本jQuery选择器:包括通过标签名、类名、ID以及属性...
**二类选择器:基于元素类型的相对位置** 1. `:first-of-type`:选择其父元素中同类的第一个元素。如果一个元素在所有同类型元素中是第一个,这个选择器就会选中它。 2. `:last-of-type`:选择其父元素中同类的...