html5--6-4 CSS选择器

实例

学习要点

  • 掌握常用的CSS选择器
  • 了解不太常用的CSS选择器

什么是选择器

当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作用的对象.

插入样式的三种方法

  1. 内联样式表(行内)
  2. 内部样式表(style中)
  3. 外部样式表
  • 创建一个外部样式表
  • 在head中使用link元素插入样式表

CSS语法

  • 单一元素的多个属性之间用分号隔开;若只有一个可以省略
  • 多个元素之间用逗号隔开
  • 如果值为若干单词,则要给值加引号;除了这种情况外其他时候不可以加引号
  • css代码的注释
  • 样式的优先顺序:
    • 设计者设计的样式>浏览器用户自定义的样式>浏览器自设的样式
    • 强制优先级:!important
  1. 行内(内联)样式
  2. 内部样式:style中的样式
  3. 外部样式

层叠、继承、冲突

  • 外观样式--比如字体、颜色可以继承;而布局有关的样式不可以继承,比如边框等

可以在同一个 HTML 文档内部引用多个外部样式表。

CSS选择器

常用选择器

  1. 通用选择器:“*”;文档中所有的内容都会加上选择器
  2. 元素选择器;比如p,比如div
  3. id选择器:前面有一个 #
  4. 类选择器:前面加符号 .
  • 给一个元素加上多个类名
  • 指定某一特定的类

转载于:https://www.cnblogs.com/Renyi-Fan/p/7991480.html

html5--6-4 CSS选择器相关推荐

  1. html中井号的作用,html5 css选择器 井号, 句点的区别

    一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成: 1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响: 2.属性(如实例 ...

  2. 好程序员HTML5前端教程-css的引入方式和选择器

    好程序员HTML5前端教程-css的引入方式和选择器 01.引入css方式(重点掌握) 行内样式 内接样式 外接样式 3.1 链接式 3.1 导入式 css介绍 现在的互联网前端分三层: HTML:超 ...

  3. HTML5类选择器使用,CSS选择器种类及使用方法

    CSS选择器种类及使用方法 2018年04月17日 | 萬仟网IT编程 | 我要评论 css选择器 有通配符选择器书写格式:*+{声名块} 并集选择器/组合选择器 书写格式;元素或类或id+" ...

  4. html 井号 作用,html5 css选择器。 井号,句号的区别

    一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...

  5. HTML5 CSS选择器总结(强烈推荐)

    你也许已经掌握了id.class.后台选择器这些基本的css选择器.但这远远不是css的全部.下面向大家系统的解析css中30个最常用的选择器,包括我们最头痛的浏览器兼容性问题.掌握了它们,才能真正领 ...

  6. HTML5+CSS3-边框背景图、多背景图、CSS选择器、网络字体、边框背景图片、过渡、放大、旋转

    边框背景图片 1.  background-origin:设置背景图片的起始原点 background-origin:border-box;------背景图片从边框开始显示 background-o ...

  7. HTML5网页设计样式-基本CSS选择器

    选择器是用来定位CSS样式代码控制的对象,实现各种效果.主要包括基本选择器和复合选择器. 基本CSS选择器 1.标记选择器 每一种HTML标记的名称都可以作为相应的选择器名称,基本格式如下: 标记名称 ...

  8. html5通用兄第选择器,css 通用兄弟选择器( ~ )

    stylus设置兄弟元素样式: 鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ ...

  9. html5类选择器用什么表示,HTML_揭秘常用的五类CSS选择器用法,有许多新手朋友不知道在什么 - phpStudy...

    揭秘常用的五类CSS选择器用法 有许多新手朋友不知道在什么情况下运用什么样的CSS选择器,针对新手朋友,对CSS选择器作一些简单的说明,这里重点介绍一下最常用的五类CSS选择器的使用. 本文向大家描述 ...

  10. html5选择器优先级,css选择器优先级怎么比较

    css选择器优先级怎么比较 CSS选择器中比较常见的有标签选择器.ID选择器.类选择器以及子选择器.而事实上,CSS选择器如果细分下来,竟然多达40多种.那他们的优先级该怎么比较呢,下面就来看看吧. ...

最新文章

  1. 具有GlassFish和一致性的高性能JPA –第3部分
  2. python筛选数据求均值_Python Pandas实现数据分组求平均值并填充nan的示例
  3. 【Flink】FlinkPer-partition watermark 问题 某个 分区延迟 导致数据丢失
  4. Java基础学习总结(95)——Java反射主要用来干什么?
  5. 让VMware ESXi 5.5与Windows时间服务器同步
  6. 小数据作为解题关键:
  7. [分享]iOS 5.0.1 桌面出现 四个白图标 的解决办法!AdSheet FieldTest iOS Diagnostics 设置。...
  8. Android来电铃声默认设置的实现方法与怎么设置语音来电的默认铃声
  9. coreldraw铺花纹_详解CorelDRAW位图图样填充
  10. 文本文件中,如何判断有效换行?
  11. 修正统计的 5 个方法
  12. 如何使用花生壳5设置HTTPS映射
  13. html中如何设计圆形图案,纯CSS绘制漂亮的圆形图案效果
  14. 【PHP】关于系统性能追踪工具molten
  15. c语言0x前缀的作用,有趣的问题,C语言程序中,为什么十六进制数字以前缀0x开头呢?...
  16. 01 基础入门:概念名词
  17. 从数学和编程的角度去看遥感影像和处理
  18. Confluence 6 配置快速导航
  19. 这部手机爆火了,网友:新一代自拍神器?
  20. OpenKruise原理介绍和安装

热门文章

  1. node2vec文献出处_社交网络分析(五)-Node2Vec
  2. linux红外驱动程序,基于Linux操作系统和红外发射器实现系统模块的设计
  3. python中的面向对象编程讲解_Python中的面向对象编程详解(上)
  4. 我慌了,纠删码是什么?我被面试官问蒙了
  5. 【干货】Oracle数据库常用十一大操作指令
  6. Spring Boot Serverless 实战 | Serverless 应用的监控与调试
  7. Apache RocketMQ 荣获 2021 中国开源云联盟优秀开源项目
  8. K8s 文档增加反种族歧视声明 | 云原生生态周报 Vol. 54
  9. 云原生时代,2个方案轻松加速百万级镜像
  10. 迅为linux下串口,迅为iMX6UL开发板多路串口开发板接口详解