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)的文字将变成蓝 ...
随机推荐
- window搭建webpack,react,babel傻瓜教程
首先现在的webpack教程已经很多了,写这篇的原因是因为自己在从小白开始的搭建过程中,并没有找到比较好的教程,花费了很多的时间,so 有了这篇博客,方便小白同学学习. node环境在这里不在赘述,p ...
- 【转】Linux 初始化 init 系统 [sysvinit systemd upstart]
http://www.ibm.com/developerworks/cn/views/linux/libraryview.jsp?sort_by=&show_abstract=true& ...
- How to get Timer Job History
1. Get Timer Job internal name with id. Job ID can be found in SharePoint CA. Below PowerShell can h ...
- 深入理解RunLoop
网上看的一篇文章,写的真好,我得多看几次好好理解理解 膜拜大神,转载至此便于学习查看. 此处标明原文链接:http://blog.ibireme.com/2015/05/18/runloop/ ...
- ListView setOnItemClickListener无效原因分析
前言 最近在做项目的过程中,在使用listview的时候遇到了设置item监听事件的时候在没有回调onItemClick 方法的问题.我的情况是在item中有一个Button按钮.所以不会回调.上百度 ...
- 编写Javascript类库(jQuery版) - 进阶者系列 - 学习者系列文章
这些年主要关注于项目管理方面的工作,编码就比较少了.这几天比较空闲,就想把原来的经验沉淀下来,一个是做好记录,以后如果忘记了还能尽快找回来,第二个是写写博文,算是练练手笔吧. 言归正传,这次写的是Ja ...
- #研发解决方案介绍#基于ES的搜索+筛选+排序解决方案
郑昀 基于胡耀华和王超的设计文档 最后更新于2014/12/3 关键词:ElasticSearch.Lucene.solr.搜索.facet.高可用.可伸缩.mongodb.SearchHub.商品中 ...
- spark streaming 与 kafka 结合使用的一些概念理解
1. createStream会使用 Receiver:而createDirectStream不会,数据会通过driver接收. 2.createStream使用 Receiver 源源不断的接收数据 ...
- YARN资源调度器
YARN资源调度器 转载请注明出处:http://www.cnblogs.com/BYRans/ 概述 集群资源是非常有限的,在多用户.多任务环境下,需要有一个协调者,来保证在有限资源或业务约束下有序 ...
- 解惑spring嵌套事物
工作中一直对spring中的事物管理都是最简单的配置 但是spring中的事物传播性配置 还有很多种,有时候经常疑惑service调用service的问题,今天的论坛上看到一篇写的非常详细的文字.记录 ...