css选择器以及使用场景
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选择器以及使用场景的更多相关文章
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- CSS 选择器【详解】
转自:http://www.cnblogs.com/polk6/archive/2013/07/19/3142142.html CSS 选择器及各样式引用方式介绍 一个好的界面,是一个Web吸引人们最 ...
- 笔记一:CSS选择器
0.前言:无论学什么,前端都是绕不开的一门技术,对于不同的人需求不同,作为一个python开发者不仅需要能读懂基本的html/css以及js代码,还要会使用它的常用的标签,以及了解比较有用的标签,把逻 ...
- 突破css选择器的局限,实现一个css地址选择器?
首先看一个效果,注意地址栏的变化 然后思考一下,用css如何实现? css选择器的局限 选择器是css中的一大特色,用于选择需要添加样式的元素. 选择器的种类有很多,比如 元素选择器 p {color ...
- css选择器
常用css选择器,希望对大家有所帮助,不喜勿喷. 1.*:通用选择器 * { margin: 0; padding: 0; } 选择页面上的全部元素,通常用于清除浏览器默认样式,不推荐使用. 2.#i ...
- dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
- CSS选择器的权重与优先规则?
我们做项目的时候,经常遇到样式层叠问题,被其他的样式覆盖,或者写的权重不高没效果,对权重没有具体的分析,做了一个总结. css继承是从一个元素向其后代元素传递属性值所采用的机制.确定应当向一个元素应用 ...
- css选择器的使用详解
-.css选择器的分类: 二.常用选择器详解: 1.标签选择器: 语法: 标签名 { 属性:属性值; } 代码示例: h1 { color: #ccc; font-size: 28px; } 2.类选 ...
- js,jq,css选择器
js获取节点: var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; / ...
随机推荐
- git clone git@github.com:snuglove/ 报错
[root@qc_centos7_5 ~]# git clone git@github.com:snuglove/Job-hunting-related.git Cloning into 'Job-h ...
- jdk5升级至jdk8框架版本选型
spring-framework-4.3.18.RELEASE 4.3.x+:JDK8 Spring JDK Version Range Spring Framework 5.1.x: JDK 8- ...
- maven 安装m2e 报错
Eclipse安装maven插件m2e m2e - http://m2eclipse.sonatype.org/sites/m2e m2e-extras - http://m2eclipse.sona ...
- springboot+web文件上传和下载
一.首先安装mysql数据库,开启web服务器. 二.pom.xml文件依赖包配置如下: <?xml version="1.0" encoding="UTF-8&q ...
- SQL Server实现远程访问
1.打开SQL Server 配置管理器(SQL Server Configuration Manager) 2.启用SQL Server网络配置的TCP/IP:选中左侧的「SQL Server网络配 ...
- java线程学习之synchronized关键字
关键字synchronized的作用是实现线程间的同步.它的任务是对同步的代码加锁.一个代码块同时只能有同一个线程进行读和写操作,从而保证线程间是安全的. 线程安全的概念是:当多个线程访问某一个类(对 ...
- TeamCity安装
1 使用docker安装 安装手册:https://hub.docker.com/r/jetbrains/teamcity-server/2 安装包安装. docker run -it --name ...
- 获取某个元素第一次出现在数组(json数组)的索引
function firstIndex(arr, text) { // 若元素不存在在数组中返回-1 let firstVal = -1; for (let i = 0; i < arr.len ...
- JZ2440学习笔记之链接文件lds
如果在Linux环境下用arm-linux-gcc来编译arm程序,需要编写链接文件lds: 1. 运行地址=链接地址,表示代码在SDRAM中执行的地址,如果程序中有对某部分代码执行过搬运,需要在ld ...
- 【模板】ST表
给定一个长度为 \(N\) 的数列,和 \(M\) 次询问,求出每一次询问的区间\([l,r]\)内数字的最大值. 说明 对于30%的数据,满足: \(1 \leq N, M \leq 10 , 1≤ ...