CSS基本知识2-CSS选择
选择就是CSS定义的第一部分,可以用面向对象的模式来理解,或者声明式的面向对象。
标准选择:
#.E
进阶选择:“,”分隔多个相同项,相当于类的实例。 如:#btn1,#btn2,.btn {...}
后代元素选择,相当于子类:
空格分隔: .nav p {...} #header .nav span {...}
子类在DOM中,是没有层级的。
子元素选择,只选一级, >
例如: nav > p {...}
相邻选择使用+,如h1 + p {margin-top:50px;}
属性选择器:按属性选择:[属性=值]
例如:input[type=text]
以上选择器,可以做And运算,就是结合起来使用
可见,CSS选择器,和Sql语言也很相似了。是声明式的。属性选择器还有更多的条件,但很少被使用(当然如果用来做应用,或许能派上大用场)
CSS媒体查询,也是类似Sql的查询,原理是一样一样的。
伪类
W3C:"W3C" 列指示出该属性在哪个 CSS 版本中定义(CSS1 还是 CSS2)。
属性 | 描述 | CSS |
---|---|---|
:active | 向被激活的元素添加样式。 | 1 |
:focus | 向拥有键盘输入焦点的元素添加样式。 | 2 |
:hover | 当鼠标悬浮在元素上方时,向元素添加样式。 | 1 |
:link | 向未被访问的链接添加样式。 | 1 |
:visited | 向已被访问的链接添加样式。 | 1 |
:first-child | 向元素的第一个子元素添加样式。 | 2 |
:lang | 向带有指定 lang 属性的元素添加样式。 |
更多的伪类,其实原理就是从Dom中查找某些特定的节点以代替编程,比如找第一个子,最后一个子,交替查找子,找为空的等等,总之,CSS选择器,就是类Sql的一个声明式编程。
CSS基本知识2-CSS选择的更多相关文章
- 【CSS】 CSS基础知识 属性和选择
css基础知识 html的基本标签都是千篇一律的,为了能够个性化外观,就需要进行样式的调整,而css就是专门用来维护,管理样式的一种格式.在html中定义css有三种方法 1. 为标签添加style属 ...
- DIV+CSS学习笔记(CSS)
css基础知识: css样式表的定义 css:(Cascading Style Sheets)层叠样式表: 分类及位置:内部样式-head区域style标签里面 外部样式-link调用 内联样式-标签 ...
- CSS基本知识和选择器
一.CSS基本知识 内联式css样式,直接写在现有的HTML标签中 内联式css样式表就是把css代码直接写在现有的HTML标签中,如下面代码: <p style="color:red ...
- css基本知识
WANGJUN59451 css基本知识 1.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets),是一种用来表现 HTML 文档样式的语言,样式定义如何显示 HT ...
- CSS 基本知识
1.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets),是一种用来表现 HTML 文档样式的语言,样式定义如何显示 HTML 元素,是能够真正做到网页表现与结构分离的 ...
- CSS基础知识01
一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold; 正常用:norma ...
- CSS入门知识汇总
1.CSS认识 在谈论CSS的概念之前,我们先说一说web标准的目的——其在于创建一个统一的用于web表现层的技术标准,以便通过不同浏览器或终端设备向最终用户展示信息内容.一个网页的呈现是由三部分组成 ...
- 〖前端开发〗HTML/CSS基础知识学习笔记
经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...
- 关于CSS的知识
这两天在学习关于HTML的知识,今天学习到CSS的知识,将自己所收获的知识点归纳一下: 首先, CSS声明学习: 1.在head标签中使用style标签声明: ...
- CSS基础知识解析
一.基础知识 1.1 CSS组成 css 样式由选择符和声明组成,而声明又由属性和值组成,如下图所示: 选择符:又称选择器,指明网页中要应用样式规则的元素,如本例中是网页中所有的段(p)的文字将变成蓝 ...
随机推荐
- Hui之Hui.js 官方文档
基础 // 判断值是否是指定数据类型 var result = hui.isTargetType("百签软件", "string"); //=>true ...
- 另类的SQL注入方法
前言:相比基于查询的SQL注入,使用insert.update和delete进行SQL注入显得略显另类 参考自:http://www.exploit-db.com/wp-content/themes/ ...
- 如何将github上的 lib fork之后通过podfile 改变更新源到自己fork的地址
解决办法: http://stackoverflow.com/questions/20936885/cocoapods-and-github-forks 就是fork完后,提交更改到自己的github ...
- 正则表达式的JS验证
/判断输入内容是否为空 function IsNull(){ var str = document.getElementById('str').value.trim(); ...
- VS的安装
一 安装过程 我直接在官网下载的 2015版本 ,软件比较大 安装起来比较花时间 同时也装了中文语言包,下面附上安装过程中的一些截图. 二 现在正在摸索如何使用,百度教程,等会附上单元测试.
- SQL SERVER 中is null 和 is not null 将会导致索引失效吗?
其实本来这个问题没有什么好说的,今天优化的时候遇到一个SQL语句,因为比较有意思,所以我截取.简化了SQL语句,演示给大家看,如下所示 declare @bamboo_Code varchar(3); ...
- SQL SERVER 属性OWNER不可用于数据库xxx。该对象可能没有此属性,也可能是访问权限不足而无法检索。
今天遇到一个案例:右键单击数据库的属性时出现下面错误提示: 属性Owner不可用于数据库xxx,该对象可能没有此属性,也可能是访问权限不足而无法检索. 使用脚本查看该数据库的Owner时发现Owner ...
- EF如何操作内存中的数据以及加载相关联表的数据:延迟加载、贪婪加载、显示加载
之前的EF Code First系列讲了那么多如何配置实体和数据库表的关系,显然配置只是辅助,使用EF操作数据库才是每天开发中都需要用的,这个系列讲讲如何使用EF操作数据库.老版本的EF主要是通过Ob ...
- StarkSoft题库管理系统(二)--生成word格式试卷
一.功能介绍 1.自定义试题库管理系统目录.难易程度,题型,知识库等. 2.试题录入. 3.强大的试题编辑功能,并与通常应用编辑工具有共通. 4.灵活的试卷构造功能,用户可自定 ...
- OpenStack 架构 - 每天5分钟玩转 OpenStack(15)
终于正式进入 OpenStack 部分了. 今天开始,CloudMan 将带着大家一步一步揭开 OpenStack 的神秘面纱. OpenStack 已经走过了 6 个年头. 每半年会发布一个版本,版 ...