css选择器有哪些
1、简单选择器,css选择器最底层的结构,组成了简单选择器。简单选择器可以分为以下几种类型:通配符*,*选择器可以命中所有的 html 元素标签选择器(Type),命中如 div、span、p 等 html 元素标签id 选择器,以#号开头,如 #abc 命中 html 中元素属性名为“id”,属性值为“abc”的元素2、复合选择器,如...
2024-01-10css选择器之间的关系
1、父元素: 直接包含其他元素,这个元素就是包含元素的父元素。2、祖先元素:包含其他元素,这个元素就是包含元素的祖先元素。3、子元素: 直接被包含的元素。这个被包含的元素就是包含元素的子元素4、后代元素: 被包含的元素。这个被包含的元素就是包含元素的后代元素。实例1、相邻选择...
2024-01-10css选择器的使用规范
1、分组选择器时,将单独的选择器单独放在一行。2、为选择器中的属性添加双引号。3、最好不要超过5级选择器级。4、每个选择器独占一列,除最后一个选择器外,其它每一列选择器均以逗号结尾。实例/* bad */.selector, .selector-secondary { padding-left: 15px;} /* good */.selector,.selector-secondary { ...
2024-01-10css后代选择器的使用
说明1、后代选择器必须用空格隔开。2、后代不仅仅是儿子, 也包括孙子/重孙子, 只要最终是放到指定标签中的都是后代。3、后代选择器不仅仅可以使用标签名称,还可以使用其它选择器。后代选择器可以通过空格一直延续下去。作用: 找到指定标签的所有特定的后代标签, 设置属性格式:标签名称1 ...
2024-01-10css后代选择器的介绍
说明1、后代选择器又称为包含选择器,可以选择作为某元素后代的元素。2、从h2开始里面包含的所有的em元素变成红色,h2为祖先,其他的em都是后代。即选中后代,不管是儿子还是孙子,只要是都会被选中,为后代选择器。语法h2 em {color:red;}实例... .c span{ color: skyblue;...
2024-01-10css选择器优先级顺序
品牌型号:联想拯救者Y9000P系统:Windows 11CSS选择器优先级从高到低排列如下:1、!important声明:带有!important声明的属性具有最高优先级。2、内联样式:在HTML元素的style属性中指定的样式具有第二高的优先级。3、ID选择器:ID选择器具有比属性选择器更高的优先级。4、类选择器、属性选择器和伪类选择器:这些选择器的优先级相同。5、元素选择器和伪元素选...
2024-01-17css子元素选择器的介绍
说明1、子元素选择器只会查找儿子, 不会查找其他被嵌套的标签。2、子元素选择器之间需要用>符号连接, 并且不能有空格。3、子元素选择器不仅仅可以使用标签名称, 还可以使用其它选择器。子元素选择器可以通过>符号一直延续下去。作用: 找到指定标签中所有特定的直接子元素, 然后设置属性。格式...
2024-01-10vue css 深度选择器
在我们想穿透的选择器前边添加>>> 或者 /deep/ 或者 ::v-deep。官方地址:https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors 官方还说 >>> 可能存在问题,建议用后两者,我们用的scss,就选择 ::v-deep...
2024-01-10css中类选择器的注意事项
注意1、每个HTML标签都有一个属性叫做class, 也就是说每个标签都可以设置类名。2、在同一个界面中class的名称是可以重复的。3、在编写class选择器时一定要在class名称前面加上.即可。类名的命名规范和id名称的命名规范一样类名就是专门用来给CSS设置样式的在HTML中每个标签可以同时绑定多个类名 ,格...
2024-01-10css标签选择器的使用注意
作用: 根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性格式:标签名称{ 属性:值;}注意:1、标签选择器选中的是当前界面中所有的标签,而不能单独选中某一个标签。2、标签选择器无论标签藏得多深都能选中。3、只要是HTML中的标签就可以作为标签选择器。(h/a/img/ul/ol/dl/...
2024-01-10css中id选择器的注意点
注意:1、每个HTML标签都有一个属性叫做id, 也就是说每个标签都可以设置id2、在同一个界面中id的名称是不可以重复的3、在编写id选择器时一定要在id名称前面加上#id的名称是有一定的规范的id的名称只能由字母/数字/下划线,a-z 0-9 _id名称不能以数字开头id名称不能是HTML标签的名称,不能是a h2 img input .....
2024-01-10css相邻兄弟选择器是什么
1、相邻兄弟选择器是指在另一个元素之后可以选择的元素,两者具有相同的父元素。2、如需选择与另一元素紧密相连的元素,且两者具有相同的父元素,则可使用相邻兄弟选择器。选择器加号(+)作为相邻兄弟的结合符。实例<!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title><style>...
2024-01-10css普通兄弟选择器如何理解
1、CSS普通兄弟选择器是指所有连接到另一个元素的元素,两者都有相同的父元素。2、普通兄弟选择器使用波浪号(~)作为普通兄弟的结合符。实例<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>普通兄弟选择器</title> <style> .ancestor...
2024-01-10java css 选择器的问题
目标网址:view-source:https://gongshang.mingluji.co...我是想把这里面的公司直接提取到字符串数组保存的时间格式可以吗?但是我找到的方法都都是通过document.select保存的elements 然后基于elements 继续过滤才能保存单个字符串循环输出,能直接过滤出字符串数组吗?回答u1s1,开始你这句我愣是弄了半天没读懂...
2024-01-10vue中能穿透组件的css选择器
如果父组件style设置了scoped,除了全局样式与子组件内部修改样式以外不受外部样式的影响,但要是父组件想修改子组件某个地方的样式但又不想为了这么一点变动去添加个全局样式该怎么做呢?这种情况可以使用带穿透功能的css选择器 >>>,如:<style scoped>.nav >>> .component{ color: #f1f1f1;}>>> .comp...
2024-01-10【CSS】css 选择器not问题
<!DOCTYPE html><html><head><style>.iSerror:not(.usermodel) input{ border:1px solid red}</style></head><body><div class="iSerror"> <input> <div class="usermodel"> <input></div></div></body></html>结果 为什么usermodel下面的input border会变成红色呢回答:.iSerror:not(.usermo...
2024-01-10css选择器以匹配没有属性x的元素
我正在处理CSS文件,发现需要设置文本输入框的样式,但是,我遇到了问题。我需要一个匹配所有这些元素的简单声明:<input /><input type='text' /><input type='password' />…但不符合以下条件:<input type='submit' /><input type='button' /><input type='image' /><input type='file' /><input type='checkbox' /><input type='radio' />...
2024-01-10css中使用a标签的伪类选择器注意点
注意点1、a标签的伪类选择器可以单独出现也可以一起出现。2、a标签的伪类选择器如果一起出现, 那么有严格的顺序要求。默认状态:link->被访问状态:visited->鼠标悬停状态:hover->鼠标长按状态:active。编写的顺序必须要遵守爱恨原则 love hate如果默认状态的样式和被访问过状态的样式一样, 那么可以缩写实...
2024-01-10css隐藏安卓手机日期选择器下拉箭头
最近有个需求是有个日期选择器,然后样式为自定义 ,ios上会自动隐藏箭头 但是Android不会,如下图然后网上各种查找 总结了一下是以下方式input[type="date"]::-webkit-inner-spin-button,input[type="date"]::-webkit-outer-spin-button,input[type="date"]::-webkit-calendar-picker-indicator{ visibility: hidden;-webkit-appearance:...
2024-01-10css后代选择器和子元素选择器的区别
说明1、后代选择器使用空格作为连接符号,子元素选择器使用>作为连接符号。2、后代选择器选中所有的特定后代标签,子元素选择器选中所有的特定的直接标签。后代选择器会选中指定标签中, 所有的特定后代标签, 也就是会选中儿子/孙子..., 只要是被放到指定标 签中的特 定标签都会被选中子元素选...
2024-01-10css3选择器归类整理_基本选择器和属性选择器
css3选择器分类css3选择器分类如下图所示选择器的语法1.基本选择器类型代码功能描述通配选择器*{ margin: 0; padding: 0; border: none; }选择文档中所有html元素元素选择器body { background: #eee; }选择指定类型的html元素类选择器.list { list-style: square; }选择指定class属性值为“class”的任意类型的...
2024-01-10js实现圆形菜单选择器
本文实例为大家分享了js实现圆形菜单选择器的具体代码,供大家参考,具体内容如下代码:<head> <style> .mask{ position: absolute; width: 502px; height: 252px; left:300px; top:350px; background: white; z-index: 999; } .con { width: 500px; height: 5...
2024-01-10css3选择器归类整理---基本选择器和属性选择器
css3选择器分类CSS3选择器分类如下图所示 选择器的语法1.基本选择器类型代码功能描述通配选择器*{ margin: 0; padding: 0; border: none; }选择文档中所有HTML元素元素选择器body { background: #eee; }选择指定类型的HTML元素类选择器.list { list-style: square; }选择指定class属性值为“class”的任意类型的...
2024-01-10使用Sass在媒体查询中扩展选择器
我有一个项目类和一个紧凑的“修饰符”类:.item { ... }.item.compact { /* styles to make .item smaller */ }这可以。但是,我想添加一个@media查询,.item以在屏幕足够小时强制类紧凑。乍一想,这就是我试图做的事情:.item { ... }.item.compact { ... }@media (max-width: 600px) { .item { @extend .item.compact; }}但这会产生以下...
2024-01-10canjs:事件触发器中的非选择器
我一直坚持以下情况。canjs:事件触发器中的非选择器1st我将点击事件处理程序添加到页面的所有元素,它调用一个小的弹出窗口。我无法从这个*选择器中分离弹出窗口,因此它会打开弹出窗口,等等。我已经试过如下:var controller = can.Control.extend({ '*:not(.popup *) click': function(el, event) { //This does not...
2024-01-10