css-目标伪类选择器:target的应用
目标伪类选择器: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的应用的更多相关文章
- [转]CSS目标伪类E:target
CSS3 target 伪类不得不说那些事儿(纯CSS实现tab切换) 是不是觉得target有点眼熟?! 今天要讲的不是HTML的<a>标签里面有个target属性. target伪类是 ...
- CSS动态伪类选择器温故-3
动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...
- CSS动态伪类选择器温故
动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...
- css的伪类选择器的使用
伪类选择器,在不同情况下显示的css,伪类选择器在处理页面的美观是很大帮助.其实很多美丽的按钮或者页面都是有这些基础的知识实现的,掌握好基础很重要. 名字 实例 说明 :link a:link 选择所 ...
- css hover伪类选择器与JQuery hover()方法
css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...
- HTML&CSS基础-伪类选择器
HTML&CSS基础-伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...
- CSS中伪类选择器及伪元素
1.伪类选择器 在CSS中,最常用的伪类选择器是使用在a(锚)元素上的几种选择器,它们的使用方法如下: a:link{color:#FF0000;text-decoration:none} a:vis ...
- 前端开发HTML&css入门——伪类选择器和一些特殊的选择器
伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited ...
- css之伪类选择器:before :after(::before ::after)
一.总结: ::before是在标签内容前面添加内容, ::after是在标签内容后面添加内容 ::before ::after与:before :after的区别:css3中修订后的伪元素使用:: ...
- 【CSS3】---结构性伪类选择器-root+not+empty+target
结构性伪类选择器—root :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素.在HTML文档中,根元素始终是<html>. 示例演示: 通 ...
随机推荐
- shell 函数传递参数的几种方式
1.最近总结了 shell 中 function 的传递变量的几种方式 1.传递单个变量 2.传递数组变量 #!/bin/bash #trying to pass an variable. ...
- java8 Stream2
new Thread(() -> System.out.println("lambda表达式,取代匿名函数......")).start(); Stream.of(" ...
- Oracle 设置自启动
1. 环境准备 1.1 系统 操作系统:CentOS 7(64位) 1.2 工具/软件 已安装完成的Oracle11g(64位): 创建数据库实例,本文中数据库实例名:test:$ORACLE_SI ...
- Win7 ODBC驱动 Excel (转)
“控制面板-管理工具-数据源(ODBC)”,打开“ODBC数据源管理器”窗口,然后“添加”,打开“创建新数据源”的窗口,最后选择Microsoft Access Driver(*.mdb)选项,往后等 ...
- hover()函数的用法
定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. 实例 当鼠标指针悬停在上面时,改变 <p> 元素的背景颜色: $("p").hove ...
- vagrant up ----失败 问题解决
命令行启动提示信息 there was an error while executing `vboxmanage`, a cli used by vagrant for controlling vir ...
- nuget cli 打包发包
微软官网打包说明:https://docs.microsoft.com/zh-cn/nuget/quickstart/create-and-publish-a-package-using-visual ...
- Python3解leetcode Binary Tree Paths
问题描述: Given a binary tree, return all root-to-leaf paths. Note: A leaf is a node with no children. E ...
- JS中数据结构之二叉查找树
树是一种非线性的数据结构,以分层的方式存储数据.在二叉树上进行查找非常快,为二叉树添加或删除元素也非常快. 一棵树最上面的节点称为根节点,如果一个节点下面连接多个节点,那么该节点称为父节点,它下面的节 ...
- centos6.8下安装nginx
我用的阿里云上的镜像,make的时候总是出错,后来说是gcc安装不完整,要重新用下面命令安装 下: yum install gcc gcc-c++ gcc-g77 接下来下载nginx用到的一些库 w ...