CSS3 选择器用法小结

表单选择器:

/*:enabled 可用的 :disabled 被禁用的 :focus 获取了焦点的 
多用在表单元素上*/
input:enabled {...}
input:disabled {...}
input:focus {...}

属性选择器:

/*[attribute] [attribute=value] 选择具有对应属性的元素
即使此属性没有实际作用*/
a[target] {...}
a[target=_blank] {...}

次序选择器:

:first-child 选取属于其父元素的首个子元素
:last-child 选取属于其父元素的最后一个子元素
:nth-child(n) 选取父元素的第n个子元素
:nth-last-child(n) 倒序选取父元素的第n个子元素

/*计算次序时不考虑类型,但如果符合次序的元素跟选择器的类型不匹配,则不会被选取*/
ul li:first-child {...}
p:nth-child(odd) {...}
p:nth-child(even) {...}
p:nth-last-child(2) {...}

:first-of-type 父元素的特定类型的首个子元素的每个元素
:last-of-type 父元素的特定类型的首个子元素的每个元素
:nth-of-type(n) 父元素的特定类型的第n个子元素
:nth-last-of-type(n) 父元素的特定类型的第n个子元素的每个元素,从最后一个子元素开始计数

/*只对类型匹配的元素进行次序计算*/
ul li:first-of-type {...}
p:last-of-type {...}
p:nth-of-type(2) {...}

 


更多专业前端知识,请上 【猿2048】www.mk2048.com

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

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

相关文章

Postgres和Oracle与Hibernate的兼容性

在某些情况下,您的JEE应用程序需要支持Postgres和Oracle作为数据库。 Hibernate应该在这里完成工作,但是有些细节值得一提。 在为已经运行Oracle的应用程序启用Postgres时,我遇到了以下棘手的部分: BLOBs支持, CLO…

Ubuntu|ython3 :ImportError: cannot import name 'main'

1、问题 rootstephen-K55VD:/usr/bin# pip3 Traceback (most recent call last):File "/usr/bin/pip3", line 9, in <module>from pip import main ImportError: cannot import name main2、解决办法 编辑/usr/bin/pip3&#xff0c;修改代码 from pip._interna…

51Nod 1362 搬箱子 —— 组合数(非质数取模) (差分TLE)

题目&#xff1a;http://www.51nod.com/Challenge/Problem.html#!#problemId1362 首先&#xff0c;\( f[i][j] \) 是一个 \( i \) 次多项式&#xff1b; 如果考虑差分&#xff0c;用一个列向量维护 0 次差分到 \( n \) 次差分即可&#xff0c;在第 \( n \) 次上差分数组已经是一…

java星座查询系统_星座查询示例代码

package api.jisuapi.astro;import api.util.HttpUtil;import net.sf.json.JSONArray;import net.sf.json.JSONObject;public class All {public static final String APPKEY "your_appkey_here";// 你的appkeypublic static final String URL "https://api.j…

Java 8 Friday Goodies:轻松派本地缓存

在Data Geekery &#xff0c;我们喜欢Java。 而且&#xff0c;由于我们真的很喜欢jOOQ的流畅的API和查询DSL &#xff0c;我们对Java 8将为我们的生态系统带来什么感到非常兴奋。 我们已经写了一些关于Java 8好东西的博客 &#xff0c;现在我们觉得是时候开始一个新的博客系列了…

【JS】使用变量作为object的key-方法汇总

1、方法一 1 var a id; 2 var str {a : 12} 3 var obj eval("("str")"); 结果&#xff1a; 1 obj{id:12} 2、方法二 1 var aname; 2 var obj{}; 3 obj[a]jack; 结果&#xff1a; 1 obj{name:jack} 3、方法三 1 var aage; 2 var obj{[a]:23}; 结果&…

JS数组与对象的遍历方法大全

本文简单解析各种数组和对象属性的遍历方法&#xff1a; 原生for循环、for-in及forEachES6 for-of方法遍历类数组集合Object.key()返回键名的集合jQuery的$.each()underscore的_.each() 文中的范例基于以下数组和对象。 var arrTmp ["value1","value2",&…

coordin.h与coordin.h

如果文件包含在尖括号中&#xff0c;则C编译器将在存储标准文件的主机系统的文件系统中查找&#xff1b; 如果文件名包含在双引号中&#xff0c;则编译器将首先查找当前的工作目录或源代码目录。如果没有在那里找到头文件&#xff0c;则将在标准位置查找。转载于:https://www.c…

java二嗨租车项目_Java入门第二季6-1租车项目代码

一共有5个类Car类 //作为父类package com.imooc;public class Car {public int ID;public String name;public int rent;public int PersonCapacity;public int GoodsCapacity;}2.passengerCar //客车public class passengerCar extends Car{public passengerCar(int newID,Str…

go语言基础知识笔记(二)之数组和切片

数组和切片知识用的也是比较多&#xff0c;的给我们工作带来很大的便利 &#xff08;一&#xff09; 数组 定义&#xff1a;在golang中数组的长度是不可变&#xff0c;数组存放要求是同一种数据类型 //golang中数组定义的四种方法1.先声明&#xff0c;后赋值  var arr1 [2]in…

错误处理在Spring Integration中如何工作

1.引言 这篇文章的目标是向您展示将消息传递系统与Spring Integration结合使用时如何处理错误。 您将看到同步和异步消息传递之间的错误处理有所不同。 和往常一样&#xff0c;我将跳过聊天并继续进行一些示例。 您可以在github上获取源代码。 2&#xff0c;样品申请 我将使用…

原生js、jQuery实现选项卡功能

在大家在网上平常浏览网页的时候&#xff0c;想必各位都会看到选项卡功能&#xff0c;在这里给大家详解一下用原生js、jQuery如何来写一些基本的选项卡 话不多说&#xff0c;先给各位看一下功能图&#xff1a; 好了&#xff0c;下边开始写代码了&#xff1a; HTML代码&#x…

.NET core2.0 发布至IIS中

.NET CORE和asp.net 发布时不太一样&#xff0c;ASP.NET Core不再是由IIS工作进程&#xff08;w3wp.exe&#xff09;托管&#xff0c;而是使用自托管Web服务器&#xff08;Kestrel&#xff09;运行&#xff0c;IIS则是作为反向代理的角色转发请求到Kestrel不同端口的ASP.NET Co…

深入了解Java 8日期和时间API

在这篇文章中&#xff0c;我们将更深入地了解通过Java 8获得的新的Date / Time API&#xff08; JSR 310 &#xff09;。 请注意&#xff0c;本文主要由显示新API功能的代码示例驱动。 我认为这些示例是不言自明的&#xff0c;因此我没有花太多时间在它们周围写文本:-) 让我们…

P4047 部落划分

这题太水了吧&#xff0c;不知道怎么蓝的&#xff0c;蒟蒻只写了十五分钟就一次AC了…… 但是挺有意思&#xff0c;就发篇题解吧qwq emmm……最小生成树&#xff08;贪心&#xff09;&#xff0c;就没别的了…… 要明确&#xff1a; 一开始可以把每个点都看成一个部落&#xff…

如何用纯 CSS 创作一个文本淡入淡出的 loader 动画

效果预览 在线演示 按下右侧的“点击预览”按钮可以在当前页面预览&#xff0c;点击链接可以全屏预览。https://codepen.io/comehope/pen/ERwpeG可交互视频此视频是可以交互的&#xff0c;你可以随时暂停视频&#xff0c;编辑视频中的代码。请用 chrome, safari, edge 打开观…

java csf_WebService CSF使用详解 | 学步园

一建立service:1)CxfService&#xff1a;WebServicepublicinterfaceCxfService {WebMethodpublicWebResultList getTasksByActor(WebParam(name"actor") String actor);WebMethodpublicvoidcreateAndStartProcessInstance(WebParam(name"processName") Str…

软件工程和项目管理的区别

软件工程的定义&#xff1a; 软件工程是研究和应用如何以系统性的、规范化的、可定量的过程化方法去开发和维护软件&#xff0c;以及如何把经过时间考验而证明正确的管理技术和当前能够得到的最好的技术方法结合起来。 项目管理的定义&#xff1a; 项目管理是一个管理学分支的学…

如何启动多个WebLogic托管服务器

WebLogic Server文档建议您创建专用的管理服务器&#xff0c;然后分离托管服务器以进行应用程序部署。 在这里&#xff0c;我将向您展示如何在与管理服务器相同的主机中创建一个或多个托管服务器。 我假设您已经安装了WLS&#xff0c;并已创建并正在运行自己的域。 如果您以前…

《机器学习基石》第一周 —— When Can Machine Learn?

&#xff08;注&#xff1a;由于之前进行了吴恩达机器学习课程的学习&#xff0c;其中有部分内容与机器学习基石的内容重叠&#xff0c;所以以下该系列的笔记只记录新的知识&#xff09; 《机器学习基石》课程围绕着下面这四个问题而展开&#xff1a; 主要内容&#xff1a; 一、…