CSS——基础选择器

简介:

   CSS的基础选择器

1   CSS指的是层叠样式表

2   CSS规则由两个主要的部分构成

   选择器,以及一条或多条声明

3   选择器通常是你需要改变样式的 HTML 元素如h1

4   每条声明由一个属性和一个值组成,每个属性有一个值,属性和值被冒号分开

5   属性大于 1 个之后,属性之间用分号隔开

6   如果值大于 1 个单词,则需要加引号

7   被分组的选择器可以分享相同的声明,用逗号将需要分组的选择器分开。

8   所有的标题元素都是红色的

9   子元素从父元素继承属性,子元素将继承最高级元素所拥有的属性(这些子元素诸如 p, td, ul, ol, ul, li, dl, dt,和 dd)。不需要另外的规则,所有body 的子元素都应该显示绿色,子元素的子元素也一样

10   css的基础选择器

10.1    派生选择器

   通过依据元素在其位置的上下文关系来定义样式,可以使标记更加简洁

    派生选择器允许你根据文档的上下文关系来确定某个标签的样式

10.2    id选择器

   Id选择器可以标有id的HTML元素,指定特定的样式,id选择器以#来定义,目前比较常用的方式是id选择器常常用于建立派生选择器上面,id的属性值只能在每个HTML中出现一次

10.3    类选择器

  在css中,类选择器以一个点号显示,css也可以用作派生选择器

   类名的第一个字符不能使用数字,它无法在摩斯拉浏览器和火狐浏览器中起作用

本文转自 拉考的考拉 51CTO博客,原文链接:http://blog.51cto.com/lakaodekaola/1928004


相关文章
|
前端开发 JavaScript
CSS:基础选择器
CSS:基础选择器
305 2
|
前端开发
CSS:高级选择器
CSS:高级选择器
298 1
|
存储 移动开发 前端开发
高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容
本文深入探讨了高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容,旨在提升开发效率、网站性能和用户体验。
486 5
|
前端开发 JavaScript UED
深入理解与应用 CSS 伪类选择器
【10月更文挑战第23天】通过以上对 CSS 伪类选择器的深入探讨,我们可以更好地理解和应用它们,为网页设计和开发带来更丰富、更灵活的样式效果。同时,要注意在实际应用中根据具体情况合理选择和使用伪类选择器,以达到最佳的设计效果和用户体验。
509 2
|
前端开发 JavaScript 容器
谁动了我的选择器?深入理解CSS选择器优先级
该文章详细解释了CSS选择器的工作原理,包括不同种类选择器的权重计算规则,并通过实例说明了如何解决样式冲突问题,确保所需的样式能够正确应用到目标元素上。
|
前端开发
前端基础(四)_CSS层叠样式表_什么是css_css样式的引入方式_样式表的优先级_样式选择器
本文详细介绍了CSS(层叠样式表)的基本概念、语法规则、引入方式、样式表的优先级和样式选择器。文章解释了CSS的作用,展示了如何在HTML中通过行内样式、内部样式和外部样式引入CSS,讨论了不同CSS选择器的优先级和如何确定最终的样式应用。此外,还强调了使用`!important`规则时的优先级高于行内样式。
974 1
|
前端开发 JavaScript
【CSS】选择器
【CSS】选择器
|
前端开发
CSS中的层级选择器&伪类选择器和伪元素选择器
CSS中的层级选择器&伪类选择器和伪元素选择器
|
前端开发
CSS3选择器
【8月更文挑战第23天】CSS3选择器。
259 1
|
前端开发 数据安全/隐私保护
探秘CSS类型选择器:解码前端设计的神秘密码!
探秘CSS类型选择器:解码前端设计的神秘密码!
探秘CSS类型选择器:解码前端设计的神秘密码!

热门文章

最新文章

  • 1
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
    589
  • 2
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
    447
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
    452
  • 4
    (CSS)使用Flex布局,帮助你快速了解各种基本的Flex布局属性以及帮你让元素快速达到布局中的指定位置!
    297
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
    575
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
    748
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
    1468
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(三):元素继承关系、层叠样式规则、字体属性、文本属性;针对字体和文本作样式修改
    325
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
    1185
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
    527