规则结构 每个规则都有两个基本部分组成:选择器和声明块。声明块由一个或多个声明组成,每个声明则是一个属性-值对。元素选择器声明和关键字 关键字一般由空格隔开;有一种情况例外 font属性中的 斜线(/)分割 元素的字体大小和行高两个关键字。分组选择器分组通配选择器 (*)css2引入 声明分组 各个声明最后使用分号;类选择器和ID选择器 类选择器 多类选择器各个词之间用空格分隔不同平台的Internet Explorer 处理不同 ...
关于CSS常用选择器:1、ID选择器 关于ID选择器具有唯一性,在文档流中,ID是唯一的,在低版本的浏览器中,允许出现不适唯一ID的情况,而在高版本的浏览器中,出现ID不唯一的情况浏览器会出现的报错的。 例如:<h1 id="warning">Meerkat <em>Central</em></h1> #warning{color:red} 进行CSS样式的设置2、类选择器 对文档元素的class属性命名不具有唯一性,也就是说不用的元素可以拥有相同的类名 例如:<h1 class="warning...
1 *:通用选择器?1* { margin:0; padding:0; }*选择器是选择页面上的全部元素,上面的代码作用是把全部元素的margin和padding设为0,最基本的清除浏览器默认样式的方法。 *选择器也可以应用到子选择器中,例如下面的代码:?1#container * { border:1pxsolidblack; }这样ID为container 的所有子标签元素都被选中了,并且设置了border。2 #id:id选择器?1234#container { width: 960px; margin: auto;}id选择器是很严格...
选择器例子例子描述CSS.class.intro选择class="intro"的所有元素1#id#firstname选择id="firstname"的所有元素1**选择所有元素2elementp选择所有p元素1element,elementdiv,p选择所有div元素和所有p元素1element elementdiv p选择div元素内部的所有p元素1element>elementdiv>p选择父元素为div元素的所有p元素2element+elementdiv+p选择紧接在div元素之后的p元素2[attribute][target]选择带有target属性所有元素2[attribute=value][t...
属性名, 属性名=属性值(正则) * 绝对等于 *= 包含这个元素 ^= 以什么开头 $= 以什么结尾 /* 存在id属性的元素 a[]{} */a[id=first]{background:orange;}/* class中有links的元素 */a[class*="links"]{background:blue;}/* 选中href中以http开头的元素 */a[href^=http]{background:red;}/* 选中href中以doc结尾的元素 */a[href$=doc]{background:black;} 原文:https://www.cnblogs.com/clblogs/p/15138878.html
1.属性选择器a[href^=column],选择属性是column开头的a标签a[href$=column],选择属性是column结尾的a标签a[href*=column],选择属性中包含column的a标签2.:root选择器类似于.html3.:empty选择没有内容的标签4.:not选择器a:not[id="footer"],选择id不是footer的a标签5.#wrap p:first-of-type选择id为wrap的容器里面的第一个p元素 原文:http://www.cnblogs.com/anson19900221/p/4564168.html
前戏之前学习了HTML相关的知识,也能简单的写一个hello world的页面。但是,只学HTML满足不了我们的需求,而HTML、CSS、JavaScript三者搭配使用才能更好的完成我们需要的效果,那他们之间的关系是什么呢?HTML是网页内容的载体CSS样式是外观控制JavaScript是行为,用来实现网页特效效果什么是CSS呢CSS层叠样式表(Cascading Style Sheets)用于定义HTML内容在浏览器内的显示样式为什么要学习CSSCSS简化HTML相关标签,网页体积小,下...
【CSS同时选择器】 同一个div拥有多个class时,我们可以作多个class作为组合来选择对象。方法就是将多个.className直接连接在一起(中间不能有空格)。<p class="important urgent warning"> This paragraph is a very important and urgent warning. </p>.important.urgent {background:silver;} 参考:http://www.w3school.com.cn/css/css_selector_class.asp原文:http://www.cnblogs.com/tekkaman/p/7082995.html
元素选择器最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器:p { text-indent:10px; color:blue; } 什么情况下使用元素选择器,一般我们这样认为: 如果你想要让页面中所有的指定元素都有这个CSS效果,可以使用元素选择器。 有这样一段html代码:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="stylesheet" type="text/css" href="index.css"><title></title></head><bo...
前端技术众多,作为一名前端工程师,我们每接触新技术首先要懂得此技术的优势和劣势,这是最基本的。往深入了说还需要懂得技术的应用场景,与之配合的技术等,方便为以后架构做准备。而less作为一门CSS预处理语言,拥有函数式变成的特点,主要优点就是高效。主要适用于包含众多CSS的大型项目。主要体现在:项目公共样式的定义,如页面主色、固定数值(宽、高、时间等)、公用样式模板、封装省略浏览器兼容前缀的函数等。1.less的两...
CSS 选择器及优先级1.根据权值计算 div .class1 #people的权值等于1+10+100=111 .class2 li #age的权值等于10+1+100=111 2.权值相同,那么以后定义的为准。 3.一般在类选择器、属性选择器、伪类选择器优先级比较容易出错。 css3选择器主要有:基本选择器 , 层次选择器, 伪类选择器 , 伪元素选择器 , 属性选择器基本选择器 层次选择器 伪类选择器分为 动态伪类选择器, 目标伪类选择器, 语言伪类选择器, UI元...
css 选择器一.基本选择器1.标签选择器 标签选择器可以选中所有的标签元素,比如div,ul,li ,p等等,不管标签藏的多深,都能选中,选中的是所有的,而不是某一个,所以说 "共性" 而不是 ”特性“body{color:gray;font-size: 12px; } /*标签选择器*/ p{color: red; font-size: 20px; } span{color: yellow; }2.id选择器 同一个页面中id不能重复。 任何的标签都可以设置id id命名规范 要以字母 可以有数字 下划线 - 大...
基础选择器一、标签选择器(元素选择器)标签选择器是指用HTML标签名称作为选择器,按标签名称分类语法:标签名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}二、类选择器1、类选择器使用"."(英文)+类名进行选择三、css命名规范1、长名称或词组可以使用中横线来为选择器命名2、不建议使用“_”下划线来命名Css选择器3、不要用纯数字或中文命名命名规范是我们通俗约定。见名知意四、多类名选择器语法:class="类名1 类名2"五、id选...
下面我们来了解一下css选择器里面的几个:only-childp:only-child选择属于其父元素的唯一子元素的每个 <p> 元素。3:nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个 <p> 元素。3:nth-last-child(n)p:nth-last-child(2)同上,从最后一个子元素开始计数。3:nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个 <p> 元素的每个 <p> 元素。3:nth-last-of-type(n)p:nth-last-of-type(2)同上,但是从最后一个子元素开...
css(Cascading Style Sheets,层叠式样式表),作用是美化HTML网页。一:样式表的分类:1,内联式样式表 和html联合显示,控制精确,样式优先级最高,但是代码重用性差。 style="样式" 例如:<div style="height:200px;"></div>2,内嵌式样i式表 作为一个独立区域内嵌在网页里,必须写在head标签里,先第二,重用性一般。3,外部式样式表 写在一个以css结尾的文件中,通过引用来建立文件与html页面的关系,优先级最低...