CSS常用选择器记录-:nth-of-type(n)

:nth-of-type(n)

  • 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.
  • n 可以是数字、关键词或公式。
.step_icon3 li.item{
    width: 30%;
    height: 40px;
    text-align: center;
    padding-top: 10px -5px 0px;
}
.step_icon3 li.item:nth-of-type(1){
    background:url(../img/find_pw_on_1.png)  no-repeat center right;
    background-size: 27px auto;
}

.step_icon3 li.item:nth-of-type(2){
    background:url(../img/find_pw_off_2.png)  no-repeat center center;
    background-size: 27px auto;
}
.step_icon3 li.item:nth-of-type(3){
    background:url(../img/icon_s3.png)  no-repeat center left;
    background-size: 27px auto;
}
时间: 2024-11-07 11:36:24

CSS常用选择器记录-:nth-of-type(n)的相关文章

【css】css常用选择器

css常用选择器 * 通配选择器 选择文档中所以HTML元素 E 元素选择器  选择指定类型的HTML元素 #id ID选择器  选择指定ID属性值为"id"的任意类型元素 .class 类选择器   选择指定class属性值为"class"的任意类型的任意多个元素 selector1,selectorN 群组选择器 将每一个选择器匹配的元素集合并 E F 后代选择器(包含选择器)  选择匹配的F元素,且匹配的F元素被包含在匹配的E元素内 E>F 子选择器 选

css常用选择器

CSS常用选择器:标签选择器,类选择器,ID选择器,派生选择器,子选择器,组合选择器 1:标签选择器:如果是一个声明,则不需要带分号,如果是多个声明,则最后一个声明不需要带分号 h1{     color: red } h1{     color: red; font-size: 14px } 2.类选择器:在CSS里用一个点开头表示类别选择器定义,所有类的选择器的名字以一点开始,在句点后面必须以字母开始,类名中允许使用字目,数字,连字号"-"和下划线"_",类名分

文章标题CSS常用选择器及与HTML结合方式

标签分类: 块级标签:block ` div p ul li table 行内标签:in line span CSS与HTML结合方式: A:在标签中的style属性里书写css代码 例:<div style="color:red;" >大家好</div> B:把css代码写到head中的style标签里,可提高css代码的重用性. 例: <style type="text/css" > div{ color:red; } <

HTML常用标签及CSS样式选择器

HTML常用标签及CSS样式选择器 html部分 <!DOCTYPE html> <html> <head> <!--头标记 写描述性的信息(css\javaScript)--> <!--引入外部的样式文件 rel:relationship的英文缩写·REL属性用于定义链接的文件和HTML文档之间的关系 --> <link rel="stylesheet" type="text/css" href=&

学习css常用基本层级伪类属性选择器

常见的css选择器包含:常用选择器.基本选择器.层级选择器.伪类选择器.属性选择器,其中常用选择器分为:1.html选择符*{}//给页面上所有的标签设置模式:2.类选择符.hcls{}//给class是hcls的一类标签设置模式:3.id选择符#h3{}//给id是h3的标签设置样式:4.关联选择符#div h1.#div h1.ljhcls:5.div,h1,pmspan,button{}基本选择器分为:first-child第一个.::first-letter第一个字母.::fist-li

CSS选择器(常用选择器)

常用选择器 直接选择标签名: id选择器 为图中“哈哈哈哈”单独改变样式 class属性 为下图中四行“嘻”字设置样式,我们可以为元素设置class属性,class属性和id属性类似,只不过class属性可以重复 拥有相同class属性值的元素我们可以说它们是一组元素 可以同时为一个元素设置多个class属性值,多个值之间使用空格隔开 id为one元素,class为two元素,和h1,同时设置一个背景色为红色 此方法较为麻烦,可使用选择器分组{并集选择器} 通过选择器分组可以同时选中多个选择器对

css以及选择器基础

CSS样式基础了解1.css基础语法CSS样式的出现是为了将内容和表现分离极大的提高了工作效率内联样式(在 HTML 元素内部)<p style="margin-left: 10px:margin-right:10px"></p><标签名 style="属性:属性值;属性:属性值;" 属性="属性值"></标签名>内部样式表(位于 <head> 标签内部)<style type=&

HTML、CSS常用技巧

一.HTML 在介绍HTML之前,我们先看一下HTML的文档树结构,主要包括哪些: (一).头部标签 1,Doctype Doctype告诉浏览器使用什么样的HTML或XHTML规范来解析HTML文档. 有和无的区别: BackCompat:标准兼容模式未开启(怪异模式.混杂模式): CSS1Compat:标准兼容模式已开启(严格模式). 这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,那么compatMode默认就是BackCompat,这也就是恶魔的开始,浏览器按照自

Css常用的技巧

一.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.  具体内容请浏览:CSS常用缩写语法 二.明确定义单位,除非值为0. 忘记定义尺寸的单位是CSS新手普遍的错误.在HTML中你可以只写width="100",但是在CSS中,你必须给一个准确的单位,比如:width:100px width:100em.只有两个例外情况可以不定义单位:0值.除此以外,其他值都必须紧跟单位,注意,不要在数值和单位之间加空格. 三.区分大小写 当在XHTML中使用CSS,CSS里定义