`
123fly
  • 浏览: 12192 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

CSS选择器

    博客分类:
  • css
阅读更多

CSS 概述

CSS 指层叠样式表 (Cascading Style Sheets)

样式定义如何显示 HTML 元素

样式通常存储在样式表中;

把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题;

外部样式表可以极大提高工作效率;

外部样式表通常存储在 CSS 文件中;

多个样式定义可层叠为一。

CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。每条声明由一个属性和一个值组成。

常见的css选择器有css id选择器,css 类选择器, css属性选择器等。

1.css id选择器

ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。

*#intro {font-weight:bold;}

 或者

#intro {font-weight:bold;}

 2.css 类选择器

类选择器允许以一种独立于文档元素的方式来指定样式。

该选择器可以单独使用,也可以与其他元素结合使用。

语法

类名前有一个点号(.),然后结合通配选择器

*.important {color:red;}

 或者

.important {color:red;}

 3.css 属性选择器

属性选择器可以根据元素的属性及属性值来选择元素。

例子

把包含标题(title)的所有元素变为红色,可以写作:

*[title] {color:red;}

 

分享到:
评论

相关推荐

    CSS选择器.pdf

    在CSS选择器的体系中,存在多种不同类型的选择器,每种都有其特定的用途和使用场景。 首先,元素选择符是最基本的类型,包括通配符选择器、标签选择器、id选择器和class选择器。通配符选择器用“*”表示,可以选中...

    react-React组件的css选择器

    在React开发中,CSS选择器是用于特定于组件的样式化的一种强大工具。React组件的样式管理是一个关键的方面,因为它影响着应用的可维护性和性能。本篇将深入探讨React组件与CSS选择器的结合使用,以及如何优化组件的...

    CSS选择器-.pdf

    此外,CSS 还提供了分组选择器,可以将多个选择器分组在一起,并应用同样的样式。例如: ```css h2, p {color: gray;} ``` 这将将 h2 和 p 元素的颜色设置为灰色。 分组选择器可以将任意多个选择器分组在一起,对此...

    scrapy爬虫之CSS选择器(比前面两个更全)

    相比XPath或其他方法,CSS选择器往往更简洁、直观,对于前端开发者来说尤其友好。 在Scrapy中,`Selector`类提供了对文档进行解析和提取数据的功能,而CSS选择器就是其主要的数据定位手段。使用CSS选择器,你可以像...

    css选择器的应用

    ### CSS选择器的应用 #### CSS概述与引入方式 CSS(层叠样式表)是一种用于定义HTML文档中元素样式的语言。它允许开发者控制网页布局、颜色、字体等外观特性,从而增强网页的表现力。CSS可以通过多种方式引入: -...

    树使用css选择器优化代码(IE7+,firefox3,opera9,chrom下可用)

    在前端开发中,CSS选择器是用于选取网页元素并应用样式的重要工具。高效的CSS选择器能够提高页面渲染速度,优化用户体验,特别是在处理大型或者复杂的页面结构时显得尤为重要。本篇文章将探讨如何使用CSS选择器来...

    前端必须掌握的css选择器方法

    下面是前端开发中经常使用的 30 个 CSS3 选择器,包括通用元素选择器、ID 选择器、类选择器、标签选择器、伪类选择器、毗邻元素选择器、子元素选择器、属性选择器等。 1. 通用元素选择器 * 通用元素选择器*是选择...

    CSS选择器详细介绍

    常用选择器是 CSS 选择器中最基本的选择器,包括三种类型:ID 选择器、类选择器和标签选择器。 * ID 选择器:根据元素的 ID 来选择元素,例如 `#demoDiv{color:#FF0000;}`。在 HTML 中,元素可以定义一个 ID 属性,...

    CSS选择器的介绍和使用.pdf

    CSS选择器的介绍和使用,什么是CSS选择器?CSS选择器可以用于我们需要添加的样式的标签。想要在HTMLl页面中的元素实现一对一,一对多或者多对一的控制,就得要使用css选择器,css选择器进控制着HTML页面中的元素。

    CSS选择器和jQuery选择器

    ### CSS选择器与jQuery选择器详解 #### 一、引言 在现代Web开发中,选择器扮演着至关重要的角色。无论是对HTML元素应用样式还是对其进行动态操作,选择器都是必不可少的工具。本文将深入探讨两种常用的选择器——...

    前端css选择器练习diner.zip

    "前端css选择器练习diner.zip" 是一个针对CSS选择器学习和实践的资源包,名为"css-diner"。 在"css-diner"这个练习中,你可以深入理解并掌握各种CSS选择器的用法,从而提升你的前端开发技能。以下是一些关于CSS选择...

    css选择器 的概要介绍与分析

    CSS选择器的灵活性和多样性是CSS强大之处的关键因素之一。下面是一些关于CSS选择器的资源描述。 ### CSS选择器资源描述 #### 1. **官方文档与教程** - **MDN Web Docs**:Mozilla提供的MDN Web Docs是学习CSS选择...

    scrapy爬虫下的CSS选择器使用

    在这个主题“Scrapy爬虫下的CSS选择器使用”中,我们将深入探讨如何利用CSS选择器在Scrapy中提取网页数据。 首先,CSS(Cascading Style Sheets)选择器是用于选取HTML或XML文档中元素的工具,其在网页设计中广泛...

    让ie兼容css选择器

    标题"让ie兼容css选择器"指的是通过引入外部JavaScript文件,如ie7.js、ie8.js和ie9.js,来增强这些旧版IE浏览器对CSS选择器的支持,使它们能够理解和应用更先进的CSS规则。这些JavaScript库通常会模拟缺失的功能,...

    四大类CSS选择器的使用说明

    ### 四大类CSS选择器的使用说明 #### 一、基础选择器 **基础选择器**主要包括四种类型:标签(元素)选择器、类选择器、ID选择器以及通配符选择器。 1. **标签选择器**:用于选取文档中的特定HTML标签。例如: `...

    css选择器介绍

    本文将深入探讨CSS选择器的种类、用法及其在实际开发中的应用。** 首先,我们要了解CSS选择器的基本分类: 1. **类型选择器**:基于元素的标签名进行选择,如`h1`,`p`等。 2. **类选择器**:使用`.`前缀,匹配...

    CSS选择器.docx

    以下是对CSS选择器的详细介绍: 一、基本选择器 通用选择器(*): 匹配HTML或XML文档中的所有元素。 例如:* { margin: 0; padding: 0; } 将所有元素的外边距和内边距设置为0。 元素(标签)选择器(E): 通过...

Global site tag (gtag.js) - Google Analytics