其基本语法格式如下： 标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 或者 元素名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 标签选择器最大的优点是能快速为页面中同类型的标签统一样式...我们可以给标签指定多个类名，从而达到更多的选择目的。...id选择器使用“#”进行标识，后面紧跟id名，其基本语法格式如下： #id名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 该语法中，id名即为HTML元素的id属性值，大多数HTML...id选择器和类选择器最大的不同在于 使用次数上。 通配符选择器 通配符选择器用“*”号表示，他是所有选择器中作用范围最广的，能匹配页面中所有的元素。...其基本语法格式如下： * { 属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 例如下面的代码，使用通配符选择器定义CSS样式，清除所有HTML标记的默认边距。
：值; } #3、注意点： 1、类名就是专门用来给某个特定的标签设置样式的 2、每个标签都可以设置一个或多个class（空格分隔），class就相当于人/标签的名称，因此同一界面内class可以重复...#2、格式 选择器1+选择器2 { 属性：值; } #3、注意点： 1、相邻兄弟选择器必须通过+号链接 2、相邻兄弟选择器只能选中你紧跟其后的那个标签，不能选中被隔开的标签 2、通用兄弟选择器...，CSS3推出 #1、作用：给指定选择器后面的所有选择器中的所有标签设置属性 #2、格式： 选择器1~选择器2 { 属性：值; } #3、注意点： 1、通用兄弟选择器必须用~来链接 2、通用兄弟选择器选中的是指选择器后面的某个选择器选中的所有标签...] 其他选择器[属性名] [属性名=值] [属性名^=值] [属性名$=值] [属性名*=值] 例1：找到所有包含id属性的标签 [id...StyleSheet层叠样式表，层叠性指的就是CSS处理冲突的一种能力，即如果有多个选择器选中了同一个标签那么会有覆盖效果 #2、注意： 1、层叠性只有在多个选择器选中了同一个标签，然后设置了相同的属性
核心： 2.优先级判断的三种方式 2.1间接选中就是指继承 如果是间接选中, 那么就是谁离目标标签比较近就听谁的 2.2相同选择器(直接选中) 如果都是直接选中, 并且都是同类型的选择器, 那么就是谁写在后面就听谁的...2.3不同选择器(直接选中) 如果都是直接选中, 并且不是相同类型的选择器, 那么就会按照选择器的优先级来层叠 id>类>标签>通配符>继承>浏览器默认 –> 优先级之important： <...作用: 当多个选择器混合在一起使用时, 我们可以通过计算权重来判断谁的优先级最高 2.权重的计算规则 2.1首先先计算选择器中有多少个id, id多的选择器优先级最高 2.2如果id的个数一样, 那么再看类名的个数..., 类名个数多的优先级最高 2.3如果类名的个数一样, 那么再看标签名称的个数, 标签名称个数多的优先级最高 2.4如果id个数一样, 类名个数也一样, 标签名称个数也一样, 那么就不会继续往下计算了,...那么此时谁写在后面听谁的 也就是说优先级如果一样, 那么谁写在后面听谁的 注意点: 1.只有选择器是直接选中标签的才需要计算权重, 否则一定会听直接选中的选择器的 --> <div id="identity1
使用公式：(“element”) 示例：(“div”) //获取所有div元素 3.类名选择器 类选择器是通过元素拥有的CSS类的名称查找匹配的...简单地说类名选择器就是以元素具有的CSS类名称查找匹配的元素。...使用公式：(“.class”) 示例：(“.box”) //获取class属性值为box的所有元素 4.复合选择器 复合选择器将多个选择器...注意：多种匹配条件的选择器并不是匹配同时满足这几个选择器的匹配条件的元素，而是将每个匹配的元素合并后一起返回。...selector2:另一个有效的选择器，可以是ID选择器、元素选择器或类名选择器等 selectorN:（可选择）任意多个选择器，可以是ID选择器、元素选择器或类名选择器等
font-size:120px; 如果一个属性名有多个值，多个值之间用 空格 隔开。...span> 示例： 效果： 3.2 类选择器 每个 HTML 标签都有一个 class 属性， class 属性值即为类名 类选择器：即以 HTML 的类名（ class...类名 { /*CSS 样式代码 */ } 适用范围：适用于将样式 一次作用在相同类名的标签上。...，词组之间可以通过中横线来分隔： 例如： main-top main-middle main-bottom 3.3 ID 选择器 每个 HTML 标签都有一个 id 属性，...3.5 扩展：属性选择器 每个标签将来都会设置不同的属性及属性值， 我们可以通过标签的属性及属性值来将样式作用于特点标签上。
z">id标签 class 在元素的属性里加上class标签，然后用”.class名称”选择所有具有相同class名称的元素。... 组合选择符 后代选取器 以空格分隔,选取改元素的所有后代，其实就是嵌套的选择的格式啦，如： div p {text-align:center;} name...属性选择符 简单属性选择 [属性]使用，无论什么属性，该选择器会选择所有具有该属性的元素，如： a[href] {color:green;} baidu 则所有具有href属性的元素都会被选择，baidu和sina就会为绿色。...也可以选择多个属性值，如： a[href="http://www.baidu.com"][title="baidu"] {background-color:green;} <a href="http:/
//通过JS的方式获取所有div标签 var divs=document.getElementsByTagName("div"); //遍历标签集合...; } //通过Jquery方式获取所有div标签 var $divs=$("div"); //通过Jquery方式遍历标签集合并修改内容 $divs.html(... //通过JS的方式获取所有div标签 var divs=document.getElementsByTagName("div"); //通过Jquery...选择器 用于筛选具有相似特征的元素 基本语法 1....[属性名]”) 属性选择器：选择所有包含对应属性，且属性值与规定相同的元素 $(“A[属性名=’属性值’]”) 复合属性选择器：包含多个属性选择器 $(“A[属性名1=’属性值1’][属性名2=’属性值
CSS选择器和规则 我们需要讨论一下如何告知我们的声明块：哪些元素是它们需要应用的。通过在每个声明块前加上选择器（selector） 来完成这一动作，选择器是一种模式，它能在页面上匹配一些元素。...属性选择器（Attribute selectors）： 通过 属性 / 属性值 匹配一个或多个元素。...同样值得一提的是，文档中的多个元素可以具有相同的类名，而单个元素可以有多个类名(以空格分开多个类名的形式书写)。...个位：在整个选择器中每包含一个元素选择器或伪元素就在该列中加1分。 下表显示了几个示例。试着通过这些，并确保你理解他们为什么具有我们给予他们的专用性。...然而选择器七同时击败了五和六——它有与五相同数量的子选择器在链中，但一个元素已被换为了一个类选择器。所以获胜的专用性值是33比23和24。
复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的,目的是为了可以选择更准确更精细的目标元素标签。...标签以什么方式进行显示，比如div 自己占一行， 比如span 一行可以放很多个 作用： 我们网页的标签非常多，再不同地方会用到不同类型的标签，以便更好的完成我们的网页。...# 简写属性 属性名 background 属性值 color image repeat position 默认值 每个属性的默认值 描述 设置背景图片是否随内容滚动 示例如下： .box {...2.并不是所有的CSS属性都可以继承，例如，下面的属性就不具有继承性：边框、外边距、内边距、背景、定位、元素高属性。...继承或者* 的贡献值 0,0,0,0 每个元素（标签）贡献值为 0,0,0,1 每个类，伪类贡献值为 0,0,1,0 每个ID贡献值为 0,1,0,0 每个行内样式贡献值 1,0,0,0 每个!
*通配选择器：针对所有标签 5.复合选择器（交集选择器）：元素加类一起设置，如果有元素在，必须由元素选择器开头（可以是多个类选择器等）同时满足才能第一次 6.分组选择器： a, h1 {} 选择多个选择器对应的元素...，最近的 p ~ span 选择下面所有的兄弟（后面的元素） 8.属性选择器：元素内的属性 id 和class 除外 语法 ： 元素[属性名] 选择含有指定属性的元素 元素[属性名 =...属性值] 选择相应属性值的元素 元素[属性名 ^ = 属性值] 选择属性值 以 指定值开头 的元素 元素[属性名 $ = 属性值] 选择属性值 以 指定值结尾 的元素 元素[属性名 *=...这样只需设置一次即可让所有的元素都具有该样式 注意：并不是所有的样式都会被继承： 比如 背景相关的，布局相关等的这些样式都不会被继承。...important ，则此时该样式会获取到最高的优先级，甚至超过内联样式，注意：在开发中这个玩意一定要慎用！不到万不得已的时候不要用，因为一旦用了，想通过js改变样式也不行了 <!
它们可以根据元素的类型、类名、ID、属性等来选择元素。例如，h1选择所有元素，.btn选择所有类名为"btn"的元素，#header选择ID为"header"的元素。...值（Value）：CSS属性的值是属性所控制的样式的具体设置。不同属性接受不同类型的值。例如，color属性可以接受颜色值，如"red"、“#00ff00”、"rgb(255, 0, 0)"等。...h1 { /* 样式规则 */ } 4.2 类选择器 类选择器以点.开头，选择HTML元素中包含指定类名的元素。例如，.btn选择所有类名为"btn"的元素。...它们使用空格分隔两个选择器。例如，div p选择所有元素，但只有当它们位于元素内部时。...div p { /* 样式规则 */ } 4.5 组合选择器 组合选择器允许将多个选择器组合在一起，以选择满足任一选择器条件的元素。组合选择器使用逗号,分隔多个选择器。
，标签放置在标签之中 格式： 选择器名称{ 属性名：属性值； 属性名：属性值；·······} 选择器就是css样式指定的作用在那些标签上；如果一个属性名有多个值，多个值之间使用 空格 隔开...如果一个属性名有多个值，多个值之间使用 空格 隔开 基本选择器 元素选择器 ...="">我要保持黑色 并集选择器 选择器1，选择器2{} 不常用的选择器 后代选择器 **选择器1 选择器2{}**会找到选择器1下的选择器1的所有后代 子元素选择器...nth-child(3){} 选中同级别同类型的第几个标签 标签:nth-of-type(3) css样式 所有的html标签都是有边框的，，只是默认的边框是不显示的 边框属性 border 用于设置边框的样式...在块结束的时候会自动换行 常见的块级元素有h系列、p、div、ul等 常见的行内元素有span、a等不会自动换行 格式 选择器{display:属性值} 常见属性值： block:将元素显为块状元素（块状元素的默认属性值
，插值表达式{{}}可以引用变量的值，即vue实例的属性值 3、在外部可以通过vue对象名.属性的方式获取属性值，在vue对象内部，通过this.属性的方式获取属性值 ...template，根组件的模板就是挂载点 每个组件模板只能拥有一个根标签 子组件的数据具有作用域，以达到组件的复用 1、根组件 <!...-- 1、通过new Vue创建的实例就是根组件(实例与组件一一对应,一个实例就是一个组件) 2、每个组件组件均拥有模板,template 3、模板: 指的是用字符串形式定义的具有唯一根标签的...-- 1、子组件也是vue实例，拥有除了el之外的所有成员，子组件的所有名字只能通过组件本身控制 2、子组件通过成员template以字符串的形式定义真正的标签 3、子组件通过成员...5、自定义属性的属性值可以是父标签的变量，也可以是常量，在子组件内，通过反射的方式利用属性名获取属性值，即实现了父标签传递数据给子标签 --> <global-tag
，属性，和数据 获取特性的值：attr(name) 设置特性的值：attr(name,value) attr(attributes) 添加类：addClass(name) removeClass(names...选择所有未被访问的连接 :visited 选择所有已被访问的链接 :hover 鼠标指针到其上的链接 :active 选择活动链接 :focus 选择获得焦点的input元素 :enabled 选择每个启用的...jQuery选择器匹配的元素 .add() 将元素添加到匹配元素的集合中 .addSelf() 把堆栈中之前的元素添加到当前集合中 .children() 获取匹配元素集合中每个元素的所有子元素 .closest...是否存在一个匹配元素 .last() 将匹配元素集合缩减为集合中的最后一个元素 .map() 把当前匹配集合中的每个元素传递给函数 .next() 获取下一个元素 .nextAll() 获得匹配元素集合中每个元素之后的所有同辈元素....prev() 获得匹配元素集合中每个元素的前一个同辈元素 .prevAll() 获得匹配元素集合中每个元素之前的所有同辈元素 .prevUntil() 获得每个元素之前所有的同辈元素，直到遇到匹配选择器的元素为止
CSS3选择器再CSS2.1选择器的基础上增加了属性选择器、伪类选择器、过滤选择器，减少了对HTML类名或ID名的依赖，避免了对HTML结构的干扰，让编写代码更加轻松。... 随意春芳歌，王孙自可留。 （3）ID选择器 ID选择器以“#”开头，然后接一个自定义的ID名。... （4）通配选择器（通配符） 如果所有的元素都需要定义相同的样式效果就用通配选择器，通配选择器以“*”表示。 李白 白居易 （3）相邻选择器 相邻选择器通过“+”分隔符进行定义，TA指定的元素关系是兄弟关系...状态伪类选择器主要是针对表单设计的，状态伪类选择器就是控制UI元素状态的，可不可用，选没选中，获取或失去焦点，锁定、待机等。 ①:enabled伪类表示匹配指定范围内所有可用UI元素。
} 以标签名为选择器名，这样写可以控制所有这类标签的样式 2，类（class）选择器（最常用） .tt{ color: blue; } sdsad .类名为选择器名，会选择整个页面上类名相同的标签，一个标签里可以写多个类 3，id选择器 #ss{ color: blue;...> div p用空格隔开，可以控制所有div标签下的所有p标签，选择器用空格隔开，后面的选择器必须要在前面的选择器里有的 6，子代选择器（只有儿子可以） div>p{ color...; color:blue; } 五、选择器的优先级 我们可以通过不同的选择器来选择标签，如果多个选择器选中了同一标签时，该以那个选择器来渲染标签呢？于是就牵扯到选择器的优先级问题。 ...一行上可以显示多个，可以设置有效的宽高，代表img，input 我们可以通过display属性来重新设置标签属性 4，display：none和visibility：hidden的区别 两者都有隐藏的作用
className：class 属性定义了元素的类名 tagName：通过标签命定位，一般不建议使用 linkText：专用于定位超链接元素（即a标签），需要完全匹配超链接的内容 partialLinkText...在Java中，selenium封装了获取元素的两个函数，区别在于前者会获得一个元素，后者获取一系列（1个或多个）元素的集合： // 获取某个元素 WebElement findElement(By var1...例如，定位百度搜索框（当然百度搜索框本身是能定位到的，这里是为了演示）： By.xpath("//*[@id='form']/span/input") 当一个元素下有多个同类型元素时，仅凭路径匹配就行不通了...，使用属性定位时要以@开头（下面form仅为示例，也可以为div、input等） //form[@id]：表示所有具有属性id的form元素。...//form[@*]：表示所有具有属性的form元素。 //form[not(@*)]：表示所有不具有属性的form元素。 //form[@id="myId"]：表示id值为myId的form元素。
基本选择器 基本选择器是jQuery中最常用的选择器，也是最简单的选择器，它通过元素id、class和标签名等来查找DOM元素。在网页中，每个id名称只能使用一次，class允许重复使用。...> $("#myDiv").css("border","3px solid red"); 3.2.2、通过类名获取元素 在网页当中，使用class属性引用样式表中的类样式，...在jQuery中，可以获取同一类名的多个HTML元素，编写方式同CSS，即在类名的前面加上点号。...语法：$(".className") 本例通过类名来获取元素，因为使用同一个类样式的元素可能有多个，所以通过类名来获取元素返回的将是一个数组对象，即jQuery中的包装集，然后对此包装集中的元素进行相关操作...,返回布尔值 $('li').has('ul') //包含特定后代的节点 $("div").children() //div中的每个子节点,第一层 $("div").find("span") //查找
语法： 标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 作用： 标签选择器 可以把某一类标签全部选择出来 比如所有的div标签 和 所有的 span标签 优点：...是能快速为页面中同类型的标签统一样式 缺点： 不能设计差异化样式。...- 多类名 我们可以给标签指定多个类名，从而达到更多的选择目的。... 貂蝉 2.4 id选择器 id选择器使用#进行标识，后面紧跟id名 其基本语法格式如下： id选择器 #id名 {属性1:属性值...选择所有的标签 选择的太多，有部分不需要 不推荐使用 * {color: red;} 基础选择器我们一共学了4个， 每个都有自己的价值， 可能再某个地方都能用到。
$("#id名") 获取指定的ID元素 类选择器 $(".class名") 获取同一类class元素 标签选择器 $("标签名")...获取同一类标签的所有元素 并集选择器 $("div,p,li") 使用逗号分隔,只要符合条件之一就会被选择 交集选择器 $("div.redClass") 获取class...$("img").attr("title", "新名字"); $("img").attr("alt", "新说明"); 用attr设置多个属性: 参数是一个对象,包含所有需要设置的属性名与属性值...CSS样式的值: var 变量 = $(selector).css("样式的key,比如background或color等"); 特别注意: 选择器获取的多个元素,获取信息获取的是第一个...jQuery在进行值获取时,只会返回第一个元素对应的值. 1.3 操作样式类名(jQuery获取并设置 CSS 类): $("#div1").addClass("divClass2") //为
领取专属 10元无门槛券
手把手带您无忧上云
