小白教程
所有教程
关于
Search
172.70.130.222
172.70.130.222
参数设置
贡献
退出
操作
编辑
移动
保护
信息
历史
删除
查看“Sel visited”的源代码
本页内容
上一节:
Sel_link
下一节:
Sel_active
因为以下原因,您没有权限编辑本页:
您请求的操作仅限属于该用户组的用户执行:
用户
您可以查看和复制此页面的源代码。
{{DISPLAYTITLE::visited}}[[Category:css selectors|14]] = CSS :visited 选择器 = [[css selectors|完整CSS选择器参考手册]] 选择访问过得链接样式: <sample title="" desc="" lang="html" hererun="1"> a:visited { background-color:yellow; } </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <style> a:visited { background-color:yellow; } </style> </head> <body> <a href="http://www.xiaobai.wang/">xiaobai.wang</a> <a href="http://www.google.com">Google</a> <a href="http://www.wikipedia.org">Wikipedia</a> <p><b>注意:</b> :visited选择器样式链接到你已经访问过的页面。</p> </body> </html> </run> == 定义和用法 == :visited向访问过的链接添加特殊的样式。 '''Tip:''' 使用:visited选择器设置访问过的页面链接的样式, [[sel hover|:hover]]选择器当有鼠标悬停在其上的链接样式,[[sel active|:active]] 选择器设置当你点击链接时的样式。 == 浏览器支持 == 表格中的数字表示支持该属性的第一个浏览器版本号。 {| class="table table-striped table-hover" ! 选择器 ! Chrome ! Internet Explorer / Edge ! Firefox ! Safari ! Opera |- | :visited | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |} == 相关文章 == CSS 教程: [[css link|CSS 链接]] CSS 教程: [[css pseudo classes|CSS 伪类]] == 更多实例 == 激活的、已访问的、未访问的或者当有鼠标悬停在其上的链接: <sample title="" desc="" lang="html" hererun="1"> a:link {color:green;} a:visited {color:green;} a:hover {color:red;} a:active {color:yellow;} </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <style> a:link {color:green;} a:visited {color:green;} a:hover {color:red;} a:active {color:yellow;} </style> </head> <body> <p>将鼠标移上并点击此链接: <a href="http://www.xiaobai.wang/">xiaobai.wang</a></p> </body> </html> </run> 不同样式的链接样式: <sample title="" desc="" lang="html" hererun="1"> a.ex1:hover,a.ex1:active {color:red;} a.ex2:hover,a.ex2:active {font-size:150%;} </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <style> a.ex1:hover,a.ex1:active {color:red;} a.ex2:hover,a.ex2:active {font-size:150%;} a.ex3:hover,a.ex3:active {background:red;} a.ex4:hover,a.ex4:active {font-family:monospace;} a.ex5:visited,a.ex5:link {text-decoration:none;} a.ex5:hover,a.ex5:active {text-decoration:underline;} </style> </head> <body> <p>将鼠标移至链接上查看其样式改变.</p> <p><a class="ex1" href="/css/">这个链接改变颜色</a></p> <p><a class="ex2" href="/css/">这个链接改变字体大小</a></p> <p><a class="ex3" href="/css/">这个链接改变背景颜色</a></p> <p><a class="ex4" href="/css/">这个链接改变字体类型</a></p> <p><a class="ex5" href="/css/">这个链接改变文字修饰</a></p> </body> </html> </run> [[css selectors|完整CSS选择器参考手册]]
返回至“
Sel visited
”。
上一节:
Sel_link
下一节:
Sel_active