css选择器 | 易学教程

jQuery选择器

阅读更多关于 jQuery选择器

. 基本css选择器选择器描述 * 匹配任何元素 E 匹配标签名称为E的所有元素 E F 匹配标签名称为F,作为E的后代节点的所有元素 E>F 匹配标签名称为F,作为E的直接子节点的所有元素 E+F 匹配前面是邻近兄弟节点E的所有元素F(E和F紧挨着) E~F 匹配前面是任何兄弟节点E的所有元素F(E和F可以不紧挨着) E:has(F) 匹配标签名称为E,至少有一个标签名称为F的后代节点的所有元素 E.C 匹配带有类名C的所有元素E. .C等效于*.C E#I 匹配id特性值为I的元素E. #I等效于*#I E[A] 匹配带有特性A的所有元素E(不管特性A的值是什么) E[A=V] 匹配所有元素E,其特性A的值正好是V E[A^=V] 匹配所有元素E,其特性A的值以V开头 E[A$=V] 匹配所有元素E,其特性A的值以V结尾 E[A*=V] 匹配所有元素E,其特性A的值包含V 2. 位置选择器选择器描述 :first 页面的最先的匹配.li a:first返回最先的,并且在li下的链接 :last 页面的最后的匹配.li a:last返回最后的,并且在li下的链接 :first-child 最先的子元素.li:first-child返回每个列表的最先的项 :last-child 最后的子元素.li:last-child返回每个列表的最后的项 :only-child

JQuery选择器

阅读更多关于 JQuery选择器

JQuery选择器 1.基本选择器和CSS的定义差不多：标签选择器 id选择器（#）类选择器（点）并集选择器（逗号） <head> <meta charset="UTF-8"> <title>选择器·基本选择器</title> <script src="js/jquery-3.3.1.min.js"></script> <script> $(function() { //id选择 $("#divOne").css("color", "red"); //标签选择 $("span").css("color", "green"); //class选择 $(".clsTwo").css("color", "blue"); //合并选取 $("#divOne,span,.clsTwo").css("fontSize", "50px"); }); </script> </head> <body> <div id="divOne">有ID的div</div> <span>span</span> <div class="clsTwo">有class的div</div> </body> <head> <meta charset="UTF-8"> <title>并集选择器：3 Click in 1</title> <script type="text/javascript" src="js

CSS选择器之基本选择器总结

阅读更多关于 CSS选择器之基本选择器总结

一、元素选择器（所有浏览器支持）元素选择器（标签名选择器）其实就是文档的元素，如html,body,p,div等等，下面例子中选择了span元素，并设置了字体颜色为红色。 <body> <p>这里使用<span>标签名选择器</span>改变了样式</p> </body> CSS： span{ color: red; } 效果：二、类选择器（所有浏览器都支持类选择器，但多类选择器（.className1.className2）不被ie6支持。）类选择器根据类名来选择，前面以 ”.” 来标志，使用类选择器之前需要在html元素上定义类名，类名自定义。 <body> <div class="demo"></div> </body> CSS .demo{ width: 150px; height: 150px; background:#0e0; } 效果：三、ID选择器（所有浏览器都支持）根据元素ID来选择元素，具有唯一性。前面以”#”号来标志。 <body> <div id="demo"></div> </body> CSS #demo{ width: 150px; height: 150px; background:red; } 效果：四、后代选择器( E F )（所有浏览器都支持）后代选择器也称为包含选择器，用来选择特定元素或元素组的后代

css入门知识:div和span,常用选择器,高级选择器

阅读更多关于 css入门知识:div和span,常用选择器,高级选择器

目录 div和span: div | span 常用选择器: 类型选择器 | 后代选择器高级选择器: 子选择器 | 相邻同胞选择器 | 属性选择器 1 div和span 1.1 div div的最重要的作用就是用来分隔文档，不要滥用，只在没有现有元素能实现区域分隔的情况下才使用div。例如，如果使用主导航列表，那么不需要将它包围在div中。不需要将主导航列表包围在div中 < div id ="mainNav" > < ul > < li > Home </ li > < li > About Us </ li > < li > Contact </ li > </ ul > </ div > 完全可删除div，直接在列表上应用ID 简化后的代码 < ul id ="mainNav" > < li > Home </ li > < li > About Us </ li > < li > Contact </ li > </ ul > 1.2 span div 可以用来对块级元素分组，而span可对行内元素进行分组或标记 span的一个实例Code < h2 > Where's Durstan? </ h2 > < p > Published on < span class ="date" > March 22nd,2005 </ span > by < span

JQ——选择器（层次选择器）

阅读更多关于 JQ——选择器（层次选择器）

1、关键程序： <script> $(function(){ $("#button1").click(function(){ $("body div").css("background-color","gold"); });//后代 $("#button2").click(function(){ $("body>div,span").css("background-color","gold"); });//子元素 $("#button3").click(function(){ $("#two+div").css("background-color","gold"); });//下一个 $("#button4").click(function(){ $("#one~div,span").css("background-color","gold"); });//兄弟 }); </script> $("#id>.classname ") //子元素选择器 $("#id .classname ") //后代元素选择器 $("#id + .classname ") //紧邻下一个元素选择器 $("#id ~ .classname ") //兄弟元素选择器 2、3、4、5、6均为1的后代元素，可以#id加空格加元素名字的方式。2、3为1的子元素，此时在两个元素之间加上“>”即可。紧邻用“+

19—陈增龙—1.26学习笔记

阅读更多关于 19—陈增龙—1.26学习笔记

Css教程 #1.20 首先要知道css是拿来渲染和改变布局和外观的大多的在head头部的style标签中定义元素的属性的属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开属性就是你要选择改变的那个特性，比如color，font size等等都算是属性声明是以{ }括起来的并且在里面是以分号结束每一个属性的特别声明 css中注释以 “/ " 开始, 以 " /” 结束（/**/）在html中是点击查询html注释如果你要在HTML元素中设置CSS样式，你需要在元素中设置"id" 和 "class"选择器。这就是为什么一些元素会有id的原因，id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。 ID属性不要以数字开头，HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 “#” 来定义。实例 #1.21 包含选择器和子选择器的区别在于包含的深度不同，前者是在选择器内的某个元素抖胸，而子选择器只能在选择器的第一级别兄弟选择器则是两个在连续的一段时才会有渲染，格式为A~B{…} 该链接的笔记2 span可以内嵌别的style，在一个语句中，可以用span将个别部分隔离开形成别的style 样式的意思就是外观，比如字体大小，颜色等等，外部样式和内部样式的区别，点击查看

JQ——选择器（基本选择器）

阅读更多关于 JQ——选择器（基本选择器）

1、JQ函数： <script> $(function(){ $("#b1").click(function(){ $("#111").css("background-color","red"); }); $("#b2").click(function(){ $(".mini").css("background-color","red"); }); $("#b3").click(function(){ $("div").css("background-color","red"); }); $("#b4").click(function(){ $("*").css("background-color","red"); }); $("#b5").click(function(){ $("#two,.mini").css("background-color","red"); }); }); </script> 该函数的功能是获取特定的元素值并添加颜色。基本选择器共有四种： $("#id") //ID选择器 $("div") //元素选择器 $(".classname") //类选择器 $(".classname,.classname1,#id1") //组合选择器 <body> <input type="button" id="b1" value="选择编号为111的元素"/>

CSS总结

阅读更多关于 CSS总结

CSS的简介： 1、CSS的定义：层叠样式表。属性和属性值用冒号分隔开，以分号结尾(这些符号都是英文的)。 2、CSS得引入方式：行内引入：<div style="这里写样式">我是一个块级的标签</div> 嵌入式：将CSS样式表放到head中用<style>标签包裹起来 <head> ... <style type="text/css"> ...此处写CSS样式 </style> </head> 导入式：将一个独立的.css文件引入HTML文件中，导入式使用@import 引入外部CSS文件，<style>标记也是写在<head>标记中。导入式会在整个网页装载完后再装载CSS文件。 <head> ... <style type="text/css"> @import "My.css"; 此处注意.css文件的路径 </style> </head> 链接式引入：将一个独立的.css文件引入到HTML文件中，使用<link>标记写在<head>标记中。链接式会以网页文件主体装载前装载CSS文件。 <head> ... <link href="My.css" rel="stylesheet" type="text/css"> </head> 3、样式的应用顺序：行内样式优先级最高针对相同的样式属性，不同的样式属性将以合并的方式呈现相同样式并且相同属性，呈现方式在

CSS中复合选择器

阅读更多关于 CSS中复合选择器

< ! DOCTYPE html > < html lang = "en" > < head > < meta charset = "UTF-8" > < title > 复合选择器后代选择器 < / title > < style > ol li { color : pink ; } ol li a { color : red ; } < / style > < / head > < body > < ol > < li > 我是ol 的孩子 < / li > < li > 我是ol 的孩子 < / li > < li > 我是ol 的孩子 < / li > < li > < a href = "#" > 我是孙子 < / a > < / li > < / ol > < ul > < li > 我是ul 的孩子 < / li > < li > 我是ul 的孩子 < / li > < li > 我是ul 的孩子 < / li > < / ul > < / body > < / html > < ! DOCTYPE html > < html lang = "en" > < head > < meta charset = "UTF-8" > < title > 复合选择器子元素选择器 < / title > < style > . nav > a { color : red ;

jQuery学习基础总结

阅读更多关于 jQuery学习基础总结

1、jQuery选择器 1.1、id选择器：$('#btnCheck') 1.2、标签选择器：$('div') 1.3、类选择器：$('.className') 1.4、标签+类选择器：$('div.className') 1.5、多条件选择器(组合、复合)：$('#id,target,.className') 1.6、层选择器 2、事件添加方法 $('选择器').事件名(function(){ }); 比如：$('#btnCheck').click(function(){ alert('Hello World'); }); 3、属性 3.1、hasClass()检查被选元素释放包含制定的class(返回true/false) 　　　　公式：$('选择器').hasClass('','') 　　　　获取选择器的标签元素内容：$('选择器').hasClass(class); 3.2、attr()属性值的设置与获取公式：$('选择器').attr('属性名'，'值'); 设置选择器的属性值，改变div的高度：$('选择器').attr('height'，'180'); 获取选择器的属性值,获取div的高度：$('选择器').attr('height'); 　　3.3、removeAttr()移除元素属性　　　　公式：$('选择器').removerAttr('属性名') 　　　

订阅 css选择器