按关键词阅读: 入门 经典 CSS
【CSS|CSS入门经典(第2版)】25、nav color: cyan;
a.offsite:link color: green;
一、:link和:visited伪类 在html中 , 用户可以使用 标签上的属性来决定链接的颜色:通过伪类 , css提供了相同的功能 , 通过将伪类选择符与class和id选择符联合 , 用户可以在页面的不同部分设置不同的颜色 , 这将在本章稍后的内容中讨论 。
:link伪类与html中的 属性相当 , 它为必须跟踪的链接定义样式 。
用户通常在 标签上设置这些定义 , 因为 是html中唯一可见的链接元素 。
下面是用:link的css规则的示例:a:link color: red;
已访问过的链接是那些用户已经进入相应页面的链接 。
浏 。
26、览器记录已访问的url , 并显示不同的颜色 。
:visited伪类用于编写应用于这些链接类型的规则 , 例如:a:visited color: gray;
:link和:visited伪选择符互相排斥 。
给定的链接在给定的时间只能是其中一种 , 不可能同时是两种 。
然而 , 用户可以编写一个应用于二者的规则 , 例如:a:link,a:visited color: blue;
警告:注意 , 将:link和:visited的颜色改变为相同的值会给用户带来问题 。
在访问它们后 , 大多数用户期望链接改变为某些颜色 , 而不是原来的颜色 , 尽管通常从蓝色变为紫色 。
如果用户具有充分的理由 , 也可以显示不同颜色的:link和:visited 。
。
27、不像只让改变链接颜色的html , 通过使用:link和:visited伪选择符 , css允许用户将几乎所有样式应用于未访问或访问过的链接 。
例如:a:link color: black;
background-color: lime;
font-family: arial, sans-serif;
a:visited color: gray;
background-color: yellow;
font-family: times new roman, serif;
这将未访问的链接变成了橙绿色背景下的黑色文本 , 将访问过的链接变成了黄色背景下的灰色文本 。
未访问的链接是arial字体 , 访问过的链接是times 。
28、 new roman字体 。
现在 , 除了说明性的例子之外 , 用户绝不会编写这样的规则 。
例如 , 用户点击了链接 , 而颜色选择又非常难看 , 这对于改变字体外观就没有什么意义了 。
然而 , 链接上的背景颜色有助于使它们突出于页面其他部分 , 这并不是一件坏事 。
在第12章将进一步学习链接样式的理论 。
要给页面上不同部分的链接标上不同的颜色 , 请将:link和:visited伪选择符与子选择符中的部分类联合起来 , 如下所示:#breadcrumb background-color: black;
color: white;
#breadcrumb a:link color: cyan;
font-size: large;
#bre 。
29、adcrumb a:visited font-size: small;
color: fuchsia;
这样就创建了一个黑色的breadcrumb记录 , 其链接是蓝绿色大字母(亮蓝) , 访问过的链接是较小的紫红色(亮紫色)字母 。
如果将这些样式添加到程序清单5-2的样式表中 , 程序清单5-1中的可访问性技巧页面将会如图5-5的页面所示 。
图5-5 伪类选择符在页面上标记链接颜色二、:first-child伪类 :first-child伪类用于选择元素 , 该元素是另一个元素的第一个子代 。
第一个子代是其他一些元素内的第一个标签 。
如果第一个子代匹配选择符的基本类型(:first-child伪类前面的部分) , 那么 。
30、规则应用于该元素 。
程序清单5-5显示了一篇小故事的开始 。
程序清单5-6将故事的第一段设置得比其他段略大一些 , 并设置为银色背景 。
显示结果如图5-6所示 。
程序清单5-5 html中的一些段落fortune of reversal link type=text/css rel=stylesheetfortune of reversal they dined on heaping platters of szechuan chicken, ofspicy beef, of shrimp and vegetables in some exotic dishwithout a name. bits of。
31、food were passed from chopsticksto chopsticks, violating all known laws of chinesecuisine etiquette. the tea flowed hot and fast that night,until the meal finally concluded itself.thank you for dining here tonight, said the badgeless,anonymous waitress. she placed a small tray containing thecheck an 。
32、d two wrapped fortune cookies on the edge of thetable, and hefted the empty plates one by one, forming astack on the crook of her elbow.absolutely delicious, declared oliver as he pulled a cardfrom his wallet and flicked it onto the bill. he picked upthe two cookies, an afterthought. fortune cookie, 。
33、 mylove? he asked amanda.程序清单5-6 使用:first-child伪类选择符的样式表/* story-5.6.css */#storytitle font-family: verdana;
.storybody p font-family: arial;
.storybody p:first-child font-size: x-large;
background-color: silver;
警告:windows的internet explorer不支持:first-child伪元素 , 它忽略这些选择符的规则 。
稿源:(未知)
【傻大方】网址:/a/2021/0813/0023654857.html
标题:CSS|CSS入门经典(第2版)( 四 )