nth-child() 子类选择器

2024-10-22

CSS3 :nth-child() 选择器

CSS3 :nth-child() 选择器代码: <!DOCTYPE html> <html> <head> <style> p:nth-child(2) { background:#ff0000; } </style> </head> <body> <h1>这是标题</h1> <p>第一个段落.</p> <p>第二个段落.</p> <p>

CSS3 nth 伪类选择器

考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</section> <ul> <li>item 1</li> <li> <ul> <li>sub item 1</li> <li>sub item 2</li> <li>sub item

CSS基础 Doctype 声明位于文档中的最前面,处于标签之前.告知浏览器的解析器,用什么文档类型规范来解析这个文档. 在标准模式中,浏览器根据规范呈现页面: 在混杂模式中,页面以一种比较宽松的向后兼容的方式显示. DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现.(影响样式) 最简单的Doctype头 <meta charset="UTF-8"> 代替了 < meta http-equiv="Content-Type" conten

CSS的引入方式及CSS选择器

一 CSS介绍现在的互联网前端分三层: a.HTML:超文本标记语言.从语义的角度描述页面结构. b.CSS:层叠样式表.从审美的角度负责页面样式. c.JS:JavaScript .从交互的角度描述页面行为 CSS:Cascading Style Sheet,层叠样式表.CSS的作用就是给HTML页面标签添加各种样式,定义网页的显示效果.简单一句话:CSS将网页内容和显示样式进行分离,提高了显示功能. css的最新版本是css3,我们目前学习的是css2.1 接下来我们要讲一下为什么要使用C

CSS选择器分类总结

一.选择器语法及其意义(pattern and meaning) Pattern Meaning CSS level E an element of type E 标记选择器,匹配所有标签名为E的元素 1 E:link E:visited an E element being the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited) 伪

jQuery 1.0 | 选择器 | 事件 | 操作样式 | 操作属性

使用jQuery: 1,下载jQuery http://jquery.com/download/ 2,引入jQuery文件 3,定义入口函数 <script src="jquery-1.12.2.js"></script> <script> // 第一种: $(document).ready(function (){ // jQuery代码 }); //第二种: $(function (){ // jQuery代码 }); </script&g

css selector regexp css选择器正则表达式 css 参考手册

jQuery 选择元素 a.text-success, a.text-danger, a.text-primary, a.text-info $("a[class^=text-]") css selector regexp css选择器正则表达式 Selectors This section is non-normative, as it merely summarizes the following sections. A Selector represents a struct

CSS之旅——第三站强大的伪选择器

说到伪选择器,真的让我体会到了CSS的无比强大,强大到自己貌似都不认识CSS了,有点C# 6.0中一些语法糖带给我们的震撼...首先我们可以在VS里面提前预览一下. 可以看到,上面的伪类有很多很多,多的让我眼都快瞎了...下面就挑一些实用性比较强的说一说. 一 :nth-child 伪选择器我们知道在jquery中有一种选择器叫做“子类选择器”,对应的有:nth-child,:first-child,:last-child,:only-child,这回在CSS中同样可以办到,可以说一定程

《CSS3实战》读书笔记第三章：选择器：样式实现的标记

第三章:选择器:样式实现的标记选择器的魔力在于,让你完全实现对网页样式的掌控.不同的选择器可以用在不同的情况下使用.总之把握的原则是:规范的编码,根据合理地使用选择器,比去背选择器的定义有价值的多. ### 标签选择器最为常用的选择工具.它重新定义了浏览器对标签默认样式的解释,影响是全局性的.正是因为选择面太广,所以无法精确检选. ### 类选择器:精确控制 class选择器允许你像word程序一样控制精确选择范围--和标签无关--甚至可以指定页面上不存在的类. 在css中类选择器必须以.开

jquery选择器之层级选择器

HTML示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div class="nav-2014"> <div class="w"

CSS定义选择器

ID与类层叠分组继承上下文选择器子类选择器其他选择器结构与注释 20.1 ID与类选择器是用于控制页面设计的样式.即ID选择器何类选择器. 一直以来,许多开发人员经常将ID与类混淆,或者不能正确的使用这两种选择器,或者简单的认为是一个代替另一个.这种认知是及其错误的. (1).应用ID 每个ID在一个页面中只能使用一次,作为某个元素的唯一标识符.一般情况下,ID只用于页面的唯一元素,如页眉,主导航条,布局区块等. 示例:<p id="hightlight">

iOS学习——UIPickerView的实现年月选择器

最近项目上需要用到一个选择器,选择器中的内容只有年和月,而在iOS系统自带的日期选择器UIDatePicker中却只有四个选项如下,分别是时间(时分秒).日期(年月日).日期+时间(年月日时分)以及倒计时.其中并没有我们所需要的只显示年月的选择器,在网上找了很多相关的资料,但是觉得都写得过于麻烦.因此,为了满足项目需求,自己用UIPickerView写了一个只显示年月的选择器界面,同时还可以控制我们的显示的最小时间.当然,如果要控制其他内容也都是可以的,无非就是在数据处理上多一些处理和控制. t

css选择器概述

css选择器种类 id选择器类选择器.属性选择器.伪类选择器元素选择器.伪元素选择器通配符选择器.子类选择器.后代选择器.相邻兄弟选择器.选择器分组一.id选择器 <p id="id"></p> #id{ color:red; } 二.类选择器.属性选择器.伪类选择器 1.类选择器 <p class="class"></p> .class{ color:black; } 2.属性选择器 <p text=&

20, CSS 定义选择器

1. ID 与类 2. 层叠 3. 分组 4. 继承 5. 上下文选择器 6. 子类选择器 7. 其他选择器 8. 结构与注释 20.1 ID 与类选择器是用于控制页面设计的样式.即 ID 选择器何类选择器. 一直以来,许多开发人员经常将 ID 与类混淆,或者不能正确的使用这两种选择器,或者简单的认为是一个代替另一个.这种认知是及其错误的. (1). 应用 ID 每个 ID 在一个页面中只能使用一次,作为某个元素的唯一标识符 . 一般情况下,ID 只用于页面的唯一元素,如页眉,主导航条 ,

HTML和CSS前端教程03-CSS选择器

目录 1. CSS定义 2. 创建CSS的三种方法 2.1. 元素内嵌(权重最高) 2.2. 文档内嵌 2.3. 外部引用 3. CSS层叠和继承 3.1. 浏览器样式 3.2. 样式表层叠 3.3. 样式继承 4. CSS选择器 4.1. 选择器的总汇 (1) 基本选择器 (2) 复合选择器 (3) 伪元素选择器:: (4) 伪类选择器 1. CSS定义层叠样式表 2. 创建CSS的三种方法 2.1. 元素内嵌(权重最高) <p style="color:red;font-size:5

jquery 学习(一) - 选择器

基本选择器(html) <div>123</div> <div id="n1">123</div> <span>321</span> <div class="n2"><span>ABC</span>123</div> <div>123</div> jquery: // 基本语法: // $(select).action()

jquery及jquery常用选择器使用

本文为博主原创,未经允许不得转载: 1.jquery强大之处: 容易上手,强大的选择器,解决浏览器的兼容完善的时间机制,出色的ajax封装,丰富的ui 2.jquery是一个javascript脚本库,不需要特别的安装,只需要我们在页面<head>标签内中, 通过script标签引入jquery库即可. <script type="text/javascript" src="js/jquery-1.8.3.js"><

day042 前端CSS选择器

今日内容: 高级选择器 1.子类选择器用 > 表示类比于相对路径选择的是前一级标签的子标签 2后代选择器用空格表示选择的是前一级标签的后代标签 3并集选择器用,逗号表示选择的是用逗号连接的标签 4交集选择器用标签名字作为开头 ,后面跟id或者是类选择器(注意,没有空格) 5.通用选择器 *选择所有的标签(使用场景一般是删除所有的空格) 6.属性选择器 [属性名] 带这个属性的标签 [属性名=’’需要匹配的属性值’’ ] 带有属性,属性名符合匹配的要求 [属性名^=’xxxx’]

css初识和css选择器

一.css是什么 css(cascading style sheet)定义如何显示HTML元素,给HTML设置样式,显得更为美观. 二.css的引入方式 1.行内引入在标签中添加一个style是属性,属性值就是设置的样式 2.内接引入在head标签中添加一个style标签,在标签内写要设置的样式 3.外界引入在head标签中添加link标签,href中指定要导入的css样式文件路径,在css文件中写样式三.css基础选择器 1.标签选择器直接写标签名{} eg:div{} 2

01-老马jQuery教程-jQuery入口函数及选择器

前言这套jQuery教程是老马专门为寒门子弟而录制,希望大家看到后能转发给更多的寒门子弟.视频都是免费,请参考课程地址:https://chuanke.baidu.com/s5508922.html 1.什么是jQuery? 1.1 jQuery介绍 jQuery是一个轻型.快速的.小巧的功能丰富的JavaScript类库.本质就是一堆js的函数的组合.对原生DOM操作做了一些非常有用的封装,可以让开发人员更简单.更方便.更统一的对DOM进行操作,比如:封装了事件相关统一操作api.DOM操作

CSS选择器之伪类选择器（元素）

:first-child 选择某个元素的第一个子元素(IE6不支持) :last-child 选择某个元素的最后一个子元素 :first-of-type [CSS3]选择一个上级元素下的第一个同类子元素 :last-of-type [CSS3]选择一个上级元素的最后一个同类子元素 :only-child [CSS3]选择的元素是它的父元素的唯一一个了元素(IE6-8不支持) :only-of-type [CSS3]选择一个元素是它的上级元素的唯一一个相同类型的子元素(IE6-8不支持) :nth