目标伪类选择器:target是众多CSS3众多 动态 伪类选择器中的一个,用来匹配锚点指向的元素,突出显示活动的HTML锚。

    <style>
div:target{
border: 2px solid black;
background: red;
}
</style>
<body>
<p>
<a href="#nei1">指向内容一</a><br>
</p>
<p>
<a href="#nei2">指向内容二</a>
</p> <divid="nei1">这是内容一</div>
<divid="nei2">这是内容二</div> </body>

该类选择器是动态选择器,只有在该选择器以指向元素时,才能使用。

  当点击"指向内容一"时,"这是内容一"的样式表会改变。

当选择器前面不写任何标签时,则该选择器会覆盖所有具有此类属性的元素。

css-目标伪类选择器:target的应用的更多相关文章

  1. [转]CSS目标伪类E:target

    CSS3 target 伪类不得不说那些事儿(纯CSS实现tab切换) 是不是觉得target有点眼熟?! 今天要讲的不是HTML的<a>标签里面有个target属性. target伪类是 ...

  2. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  3. CSS动态伪类选择器温故

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  4. css的伪类选择器的使用

    伪类选择器,在不同情况下显示的css,伪类选择器在处理页面的美观是很大帮助.其实很多美丽的按钮或者页面都是有这些基础的知识实现的,掌握好基础很重要. 名字 实例 说明 :link a:link 选择所 ...

  5. css hover伪类选择器与JQuery hover()方法

    css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...

  6. HTML&CSS基础-伪类选择器

    HTML&CSS基础-伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

  7. CSS中伪类选择器及伪元素

    1.伪类选择器 在CSS中,最常用的伪类选择器是使用在a(锚)元素上的几种选择器,它们的使用方法如下: a:link{color:#FF0000;text-decoration:none} a:vis ...

  8. 前端开发HTML&css入门——伪类选择器和一些特殊的选择器

    伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited ...

  9. css之伪类选择器:before :after(::before ::after)

    一.总结: ::before是在标签内容前面添加内容, ::after是在标签内容后面添加内容 ::before ::after与:before  :after的区别:css3中修订后的伪元素使用:: ...

  10. 【CSS3】---结构性伪类选择器-root+not+empty+target

    结构性伪类选择器—root :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素.在HTML文档中,根元素始终是<html>. 示例演示: 通 ...

随机推荐

  1. 从1<2<3的语法糖说起

    python有一个很有意思的语法糖你可以直接写1<2<3. 这复合我们通常意义上的数学不等式,但对学过C等语言其实是有疑惑的. 我们知道不等式返回的其实是个Bool值,在C中是1,0因此C ...

  2. mongodb 索引分类

    一. 普通索引篇 1.创建索引 创建索引:db.person.ensureIndex({"age":1}).这里我们使用了ensureIndex在age上建立了索引.“1”:表示按 ...

  3. jquery 小知识

    $("p:eq(0)") :表p标签的第一个元素 $("p:eq(1)") :表p标签的第二个元素

  4. vue之click事件绑定

    1.@click不光可以绑定方法,也可以就地修改data里的数据 代码示例代码如下: 2.@click绑定多个操作的时候用:隔开 代码示例代码如下: <el-table><el-ta ...

  5. Es学习第七课, term、terms、match等基本查询语法

    term.terms查询 term query会去倒排索引中寻找确切的term,它并不知道分词器的存在,这种查询适合keyword.numeric.date等明确值的 term:查询某个字段里含有某个 ...

  6. session有效时间

    request.getSession().setMaxInactiveInterval(-1);//session不失效 request.getSession().setMaxInactiveInte ...

  7. Kafka初识

    1.概述 1.1.Apache Kafka是一个   分布式  流处理   平台: 2.Kafka适应于什么场景? 2.1.构造  实时  流数据管道,在  系统 或 应用之间  可靠地获取数据(相当 ...

  8. paper 149:Deep Learning 学习笔记(一)

     1. 直接上手篇 台湾李宏毅教授写的,<1天搞懂深度学习> slideshare的链接: http://www.slideshare.net/tw_dsconf/ss-62245351? ...

  9. http 请求包含哪几个部分(请求行、请求头、请求体)

    http协议报文     1.请求报文(请求行/请求头/请求数据/空行)         请求行             求方法字段.URL字段和HTTP协议版本             例如:GET ...

  10. bugku | flagphp

    1.开脑洞 http://123.206.87.240:8002/flagphp/?hint=1 2.读源码得到条件是要求反序列化后的‘ISecer’的值等于$KEY <?php error_r ...