小编给大家分享一下target伪类选择器指的是什么,希望大家阅读完这篇文章后大所收获,下面让我们一起去探讨吧!
创新互联-专业网站定制、快速模板网站建设、高性价比青川网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式青川网站制作公司更省心,省钱,快速模板网站建设找我们,业务覆盖青川地区。费用合理售后完善,10余年实体公司更值得信赖。target选择器简介
:target选择器用于选取页面中的某个target元素。那什么是target元素呢?target元素,说白了就是该元素的id被当做页面的超链接来使用。很难理解?还是上个菜给大家品尝一下先吧。
举例:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CSS3 :target选择器</title> <style type="text/css"> :target h4 { color:red; } </style> </head> <body> <div> <a href="#music">推荐音乐</a><br /> <a href="#movie">推荐电影</a><br /> <a href="#article">推荐文章</a><br /> </div> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> <div id="music"> <h4>推荐音乐</h4> <ul> <li>林俊杰-被风吹过的下图</li> <li>曲婉婷-在我的歌声里</li> <li>许嵩-灰色头像</li> </ul> </div> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> <div id="movie"> <h4>推荐电影</h4> <ul> <li>蜘蛛侠系列</li> <li>钢铁侠系统</li> <li>复仇者联盟</li> </ul> </div> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> ……<br /> <div id="article"> <h4>推荐文章</h4> <ul> <li>朱自清-荷塘月色</li> <li>余光中-乡愁</li> <li>鲁迅-阿Q正传</li> </ul> </div> </body> </html>
效果如下:
分析:
当点击锚点链接时,相应的target元素下的h4标签字体颜色就会变为红色。
:target选择器一般都是结合锚点链接来使用,更好地给读者进行导航效果,这也是对用户体验非常好的一个做法。
看完了这篇文章,相信你对target伪类选择器指的是什么有了一定的了解,想了解更多相关知识,欢迎关注创新互联网站制作公司行业资讯频道,感谢各位的阅读!
网页名称:target伪类选择器指的是什么-创新互联
文章链接:https://www.cdcxhl.com/article36/cochpg.html
成都网站建设公司_创新互联,为您提供App设计、云服务器、网站设计、ChatGPT、外贸建站、网站排名
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联