CSS选择器学习笔记

在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。

“CSS” 列指示该属性是在哪个 CSS 版本中定义的。(CSS1、CSS2 还是 CSS3。)

选择器例子例子描述CSS
.class.intro选择 class=“intro” 的所有元素。1
#id#firstname选择 id=“firstname” 的所有元素。1
**选择所有元素。2
elementp选择所有

元素。

1
element,elementdiv,p选择所有
元素和所有

元素。

1
element elementdiv p选择
元素内部的所有

元素。

1
element>elementdiv>p选择父元素为
元素的所有

元素。

2
element+elementdiv+p选择紧接在
元素之后的所有

元素。

2
[attribute][target]选择带有 target 属性所有元素。2
[attribute=value][target=_blank]选择 target="_blank" 的所有元素。2
[attribute~=value][title~=flower]选择 title 属性包含单词 “flower” 的所有元素。2
[attribute|=value][lang|=en]选择 lang 属性值以 “en” 开头的所有元素。2
:linka:link选择所有未被访问的链接。1
:visiteda:visited选择所有已被访问的链接。1
:activea:active选择活动链接。1
:hovera:hover选择鼠标指针位于其上的链接。1
:focusinput:focus选择获得焦点的 input 元素。2
:first-letterp:first-letter选择每个

元素的首字母。

1
:first-linep:first-line选择每个

元素的首行。

1
:first-childp:first-child选择属于父元素的第一个子元素的每个

元素。

2
:beforep:before在每个

元素的内容之前插入内容。

2
:afterp:after在每个

元素的内容之后插入内容。

2
:lang(language)p:lang(it)选择带有以 “it” 开头的 lang 属性值的每个

元素。

2
element1~element2p~ul选择前面有

元素的每个

  • 元素。

3
[attribute^=value]a[src^=“https”]选择其 src 属性值以 “https” 开头的每个 <a> 元素。3
[attribute$=value]a[src$=".pdf"]选择其 src 属性以 “.pdf” 结尾的所有<a> 元素。3
[attribute*=value]a[src*=“abc”]选择其 src 属性中包含 “abc” 子串的每个 <a> 元素。3
:first-of-typep:first-of-type选择属于其父元素的首个 <p> 元素的每个 <p> 元素。3
:last-of-typep:last-of-type选择属于其父元素的最后 <p> 元素的每个 <p> 元素。3
:only-of-typep:only-of-type选择属于其父元素唯一的\

元素的每个 <p> 元素。

3
:only-childp:only-child选择属于其父元素的唯一子元素的每个 <p> 元素。3
:nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个<p> 元素。3
:nth-last-child(n)p:nth-last-child(2)同上,从最后一个子元素开始计数。3
:nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个 <p> 元素的每个

元素。

3
:nth-last-of-type(n)p:nth-last-of-type(2)同上,但是从最后一个子元素开始计数。3
:last-childp:last-child选择属于其父元素最后一个子元素每个 <p> 元素。3
:root:root选择文档的根元素。3
:emptyp:empty选择没有子元素的每个 <p> 元素(包括文本节点)。3
:target#news:target选择当前活动的 #news 元素。3
:enabledinput:enabled选择每个启用的 <input> 元素。3
:disabledinput:disabled选择每个禁用的 <input> 元素3
:checkedinput:checked选择每个被选中的 <input> 元素。3
:not(selector):not§选择非 <p> 元素的每个元素。3
::selection::selection选择被用户选取的元素部分。3

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/402220.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

rubymine 调试 redmine

1、安装debase和ruby-debug-ide包。&#xff08;注意版本&#xff0c;rubymine 8.0.2下&#xff0c;bitnami下的版本需安装debase -v 0.2.1版本&#xff0c;网上有文章说用debase -v 0.2.2beta6。容易在rubymine启动调试时出现找不到ruby-debug-ide等错误提示&#xff09; 启动…

Linux 设备驱动中的 I/O模型(二)—— 异步通知和异步I/O

阻塞和非阻塞访问、poll() 函数提供了较多地解决设备访问的机制&#xff0c;但是如果有了异步通知整套机制就更加完善了。 异步通知的意思是&#xff1a;一旦设备就绪&#xff0c;则主动通知应用程序&#xff0c;这样应用程序根本就不需要查询设备状态&#xff0c;这一点非常类…

判断链表是否有环

链表有环的情况一般是链表的尾指向前面的节点而不是null&#xff0c;如head->node1->node2->node3->node4->tail->node2&#xff0c;该链表存在环。判断环是否存在可以借助两个指针&#xff0c;一个指针每次迭代只移动一步&#xff0c;第二个指针每次迭代移动…

Python 爬虫进阶五之多线程的用法

我们之前写的爬虫都是单个线程的&#xff1f;这怎么够&#xff1f;一旦一个地方卡到不动了&#xff0c;那不就永远等待下去了&#xff1f;为此我们可以使用多线程或者多进程来处理。 首先声明一点&#xff01; 多线程和多进程是不一样的&#xff01;一个是 thread 库&#xff0…

Tomcat8 连接池

1、所有的tomcat项目共用一个连接池配置 1.1 修改conf->context.xml文件&#xff0c;在Context节点下配置 <Resource name"jdbc/myDataSource" type"javax.sql.DataSource" driverClassName"com.microsoft.sqlserver.jdbc.SQLServerDriver"…

Linux 设备驱动中的 I/O模型(一)—— 阻塞和非阻塞I/O

在前面学习网络编程时&#xff0c;曾经学过I/O模型 Linux 系统应用编程——网络编程&#xff08;I/O模型&#xff09;&#xff0c;下面学习一下I/O模型在设备驱动中的应用。 回顾一下在Unix/Linux下共有五种I/O模型&#xff0c;分别是&#xff1a; a -- 阻塞I/O b -- 非阻塞I/O…

3.改变 HTML 内容

①xdocument.getElementById("demo") //查找元素 ②x.innerHTML"Hello JavaScript"; //改变内容 <!DOCTYPE html><html><body> <h1>我的第一段 JavaScript</h1> <p id"demo">JavaScript 能改变 HTML 元素的…

Python 爬虫进阶六之多进程的用法

python 中的多线程其实并不是真正的多线程&#xff0c;并不能做到充分利用多核 CPU 资源。 如果想要充分利用&#xff0c;在 python 中大部分情况需要使用多进程&#xff0c;那么这个包就叫做 multiprocessing。 借助它&#xff0c;可以轻松完成从单进程到并发执行的转换。mult…

DEFINE_PER_CPU

转自 http://www.unixresources.net/linux/clf/linuxK/archive/00/00/47/91/479165.html 首先&#xff0c;在arch/i386/kernel/vmlinux.lds中有 /*will be free after init*/ .ALIGN(4096); __init_begin.; /*省略*/ .ALIGN(32); __per_cpu_start.; .data.percpu:{*(.data.perc…

HDU 1213 How Many Tables(并查集模板)

http://acm.hdu.edu.cn/showproblem.php?pid1213 题意&#xff1a; 这个问题的一个重要规则是&#xff0c;如果我告诉你A知道B&#xff0c;B知道C&#xff0c;这意味着A&#xff0c;B&#xff0c;C知道对方&#xff0c;所以他们可以留在一个桌子。例如&#xff1a;如果我告诉你…

Linux 设备驱动的并发控制

Linux 设备驱动中必须要解决的一个问题是多个进程对共享的资源的并发访问&#xff0c;并发的访问会导致竞态&#xff0c;即使是经验丰富的驱动工程师也常常设计出包含并发问题bug 的驱动程序。 一、基础概念 1、Linux 并发相关基础概念 a -- 并发&#xff08;concurrency&#…

Python爬虫入门一综述

网络爬虫是一种自动抓取万维网信息的程序。 学习python爬虫&#xff0c;需要学习以下知识&#xff1a; python基础python中的urllib和urllib2库的用法python正则表达式python爬虫框架scrapypython爬虫高级功能 1.python基础 廖雪峰python教程 2.python urllib和urllib2库使…

Python爬虫学习二爬虫基础了解

1.什么是爬虫 爬虫就是进入网页自动获取数据的程序。当它进入一个网页时&#xff0c;将网页上需要的数据下载下来&#xff0c;并跟踪网页上的其他链接&#xff0c;进入新的页面下载数据&#xff0c;并继续跟踪链接下载数据。 2.URL URL&#xff0c;即统一资源定位符&#xf…

第三章:多坐标系

第一节&#xff1a;为什么要有多坐标系 当我们使用一个坐标系来描绘整个场景的时候&#xff0c;场景中的任意点都可以用该坐标系描述&#xff0c;此时如果有一只羊一遍摇动着耳朵&#xff0c;一边走&#xff0c;这个时候如果进行坐标的转换会发现异常的麻烦&#xff0c;此时如果…

Linux 设备驱动开发 —— 设备树在platform设备驱动中的使用

关与设备树的概念&#xff0c;我们在Exynos4412 内核移植&#xff08;六&#xff09;—— 设备树解析 里面已经学习过&#xff0c;下面看一下设备树在设备驱动开发中起到的作用 Device Tree是一种描述硬件的数据结构&#xff0c;设备树源(Device Tree Source)文件&#xff08;以…

Python爬虫入门三urllib库基本使用

urllib是一个收集了多个涉及了URL的模块的包&#xff1a; URL获取网页 urllibtest.pyimport urllib2 response urllib2.urlopen(http://www.baidu.com) print(response.read())运行结果&#xff1a; C:\Python27\python.exe H:/spiderexercise/spidertest/urllibtest.py &l…

使用老毛桃U盘重装Windows10系统

使用老毛桃U盘启动盘重装Windows10系统&#xff0c;这个方法很常用&#xff0c;相比较一些别的方法去重装系统&#xff0c;这个方法更方便更简单&#xff0c;容易入手和掌握。 在重装系统前&#xff0c;先去微软的官网把Windows10的ISO镜像文件下载下来&#xff0c;去别的网站下…

Android 网络通信框架Volley简介(Google IO 2013)

1. 什么是Volley 在这之前&#xff0c;我们在程序中需要和网络通信的时候&#xff0c;大体使用的东西莫过于AsyncTaskLoader&#xff0c;HttpURLConnection&#xff0c;AsyncTask&#xff0c;HTTPClient&#xff08;Apache&#xff09;等&#xff0c;今年的Google I/O 2013上&…

Linux 设备驱动开发 —— platform设备驱动应用实例解析

前面我们已经学习了platform设备的理论知识Linux 设备驱动开发 —— platform 设备驱动 &#xff0c;下面将通过一个实例来深入我们的学习。 一、platform 驱动的工作过程 platform模型驱动编程&#xff0c;需要实现platform_device(设备)与platform_driver&#xff08;驱动&am…

python使用proxy

使用urllib proxies {http: http://host:port} resp urllib.urlopen(url, proxiesproxies) content resp.read()使用urllib2 import urllib2enable_proxy True proxy_handler urllib2.ProxyHandler({"http" : your_proxy}) null_proxy_handler urllib2.Proxy…