1.选择器以及使用场景

id选择器:#header{}

类选择器:.header{}

元素选择器:div{}

子选择器:ul > li{}

后代选择器:div p{}

伪类选择器:a:hover{}

属性选择器:input[type="text"]

id优先高于class;

2.权重怎么计算

4个等级的定义如下:

第一等:代表内联样式,如: style=””,权值为1000。

第二等:代表ID选择器,如:#content,权值为100。

第三等:代表类,伪类和属性选择器,如.content,权值为10。

第四等:代表类型选择器和伪元素选择器,如div p,权值为1。

3.css几种布局

css选择器以及使用场景的更多相关文章

  1. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  2. CSS 选择器【详解】

    转自:http://www.cnblogs.com/polk6/archive/2013/07/19/3142142.html CSS 选择器及各样式引用方式介绍 一个好的界面,是一个Web吸引人们最 ...

  3. 笔记一:CSS选择器

    0.前言:无论学什么,前端都是绕不开的一门技术,对于不同的人需求不同,作为一个python开发者不仅需要能读懂基本的html/css以及js代码,还要会使用它的常用的标签,以及了解比较有用的标签,把逻 ...

  4. 突破css选择器的局限,实现一个css地址选择器?

    首先看一个效果,注意地址栏的变化 然后思考一下,用css如何实现? css选择器的局限 选择器是css中的一大特色,用于选择需要添加样式的元素. 选择器的种类有很多,比如 元素选择器 p {color ...

  5. css选择器

    常用css选择器,希望对大家有所帮助,不喜勿喷. 1.*:通用选择器 * { margin: 0; padding: 0; } 选择页面上的全部元素,通常用于清除浏览器默认样式,不推荐使用. 2.#i ...

  6. dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来

    dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...

  7. CSS选择器的权重与优先规则?

    我们做项目的时候,经常遇到样式层叠问题,被其他的样式覆盖,或者写的权重不高没效果,对权重没有具体的分析,做了一个总结. css继承是从一个元素向其后代元素传递属性值所采用的机制.确定应当向一个元素应用 ...

  8. css选择器的使用详解

    -.css选择器的分类: 二.常用选择器详解: 1.标签选择器: 语法: 标签名 { 属性:属性值; } 代码示例: h1 { color: #ccc; font-size: 28px; } 2.类选 ...

  9. js,jq,css选择器

    js获取节点: var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; / ...

随机推荐

  1. 小程序wx:for Do not set same key \"NaN\" in wx:key.

    在使用wx:for的时候出现了Do not set same key \"NaN\" in wx:key. 去网上查看资料,说是使用wx:key 试了一下,没用 字面意思是不要设置 ...

  2. python安装pip的步骤记录

    因为重新装了系统,所以python所有的环境都要重新走一遍. 首先去python官网下载python最新版本.如果python没有自动加入环境变量的话就需要你自己手动加入.这个一般在安装python的 ...

  3. Oracle数据库的一些重要概念

    一.oracle数据库的结构 完整的Oracle数据库通常由两部分组成:Oracle数据库和数据库实例. 1) 数据库是一系列物理文件的集合(数据文件,控制文件,联机日志,参数文件等): 2) Ora ...

  4. 编程规范(初尝ES6与webpack)

    //针对ES6规范(第1-5条)start1.块级作用域let/const取代var:在let和const之间,建议优先使用const,尤其是在全局环境,不应该设置变量,只应设置常量. 2.解构赋值1 ...

  5. Linq高级查询,分页查询及查询分页结合

    一.高级查询与分页查询 1.以...开头    StartsWith Repeater1.DataSource=con.Users.Where(r=>r.Nickname.StartsWith( ...

  6. 中文编码错误,Error output could not be translated from the native locale to UTF-8.

    假如使用http访问仓库,用户配置的pre-commit钩子里面如果有中文,可能会出现"Error output could not be translated from the nativ ...

  7. sql 与 mysql 链接数据库

  8. C# 反射 Type.GetType()

    对于外部调用的动态库应用反射时要用到Assembly.LoadFile(),然后才是获取类型.执行方法等;当用反射创建当前程序集中对象实例或执行某个类下静态方法时只需通过Type.GetType(&q ...

  9. 安卓GreenDao(基础)

    GreenDao的基础使用很简单,网上一大筐,推荐在简书里面搜索,那么我这里要说些什么呢,试想,这些简单的Demo可以带你了解GreenDao,但你能用这些代码做公司的项目么,肯定不行,所以我结合自身 ...

  10. knative

    office Doc Knative 简介 Install sevice example (knative) There is only one node in the cluster so we u ...