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. 棋盘游戏，dfs搜索

    问题描述 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大小的棋盘,摆放k个棋子的所有可行的摆 ...

  2. Python在终端通过pip安装好包以后，在Pycharm中依然无法使用的解决办法

    在终端通过pip装好包以后,在pycharm中导入包时,依然会报错.新手不知道具体原因是什么,我把我的解决过程发出来. pip install 解决方案一: 在Pycharm中,依次打开File--- ...

  3. Java基础语法-Lambda表达式

    1.Lambda表达式主要用于简写接口的操作等出现匿名内部类的地方,如下:我这里先定义一个Swim接口,以及它所定义的swim()方法 interface Swim{ void swim(); } 2 ...

  4. Qt3D Shader

    --------------------------------------------------- Qt3D ShaderPrograme Qt3D GLSL 渲染器 Shader示例可参考: h ...

  5. React脚手架create-react-app

    1.安装过程 $cnpm install -g -create-react-app $create-react-app apps $cd apps/ $npm start 2.图片路径 不能用相对路径 ...

  6. C#winform窗体利用系统抓取关闭按钮事件

    const int WM_SYSCOMMAND = 0x112;        const int SC_CLOSE = 0xF060;        const int SC_MINIMIZE = ...

  7. 网站https证书SSL证书相关

    网站https证书SSL证书相关 二级域名可以申请证书来使用,主域名申请的单域名证书,二级域名不在https加密保护内,通配符证书可以保护主域名下所有的二级子域名,二级域名等于和主域名使用的同一张证书 ...

  8. ltp-ddt nor_mtd_dd_rw_jffs2

    nor_mtd_dd_rw_jffs2运行报错 error getting mtd part number: $part get_mtd_biggest_part for $DEVICE_TYPE: ...

  9. markdown test2

    #home { width: auto; margin: 0 80px 0 0; } mkdir test. #include <msxml6.h> // 含有 MSXML最新版 #inc ...

  10. 图像处理 Matlab实现线性点运算、非线性点运算、点运算与直方图、直方图均衡化

    今天,我们学习了直方图.于是乎,回来我就用matlab代码实现一下.昨天受到道路检测老师课上一个内容的影响(对于道路裂缝的检测,我突发奇想,如果对于道路图像进行操作,是否能够让裂缝与道路分离,使得图像 ...