css第一个元素 | 易学教程

学习css常用基本层级伪类属性选择器

阅读更多关于学习css常用基本层级伪类属性选择器

常见的css选择器包含：常用选择器、基本选择器、层级选择器、伪类选择器、属性选择器，其中常用选择器分为：1.html选择符*{}//给页面上所有的标签设置模式；2.类选择符.hcls{}//给class是hcls的一类标签设置模式；3.id选择符#h3{}//给id是h3的标签设置样式；4.关联选择符#div h1、#div h1.ljhcls；5.div,h1,pmspan,button{} 基本选择器分为:first-child第一个、::first-letter第一个字母、::fist-line第一行、:last-child最后一个元素、:nth-child(n)第几个元素，层级选择器分为a,b组合、a b后代、a>b子代、a+b a的一个是b，伪类选择器:hover鼠标经过、:focus焦点、::selection文字选中背景色，属性选择器 [属性]、[属性=值]、[属性~=值]//包含任意一个值、[属性^=值]以什么开始、[属性$=值]以什么结束。 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title

优化网站性能的14条军规快速提高网站访问速度

阅读更多关于优化网站性能的14条军规快速提高网站访问速度

优化网站性能的14条军规快速提高网站访问速度相信互联网已经越来越成为人们生活中不可或缺的一部分。ajax，flex等等富客户端的应用使得人们越加“幸福”地体验着许多原先只能在C/S实现的功能。比如Google几乎已经把最基本的office应用都搬到了互联网上。当然便利的同时毫无疑问的也使页面的速度越来越慢。自己是做前端开发的，在性能方面，根据yahoo的调查，后台只占5%，而前端高达95%之多，其中有88%的东西是可以优化网站性能的。以上是一张web2.0页面的生命周期图。工程师很形象地讲它分成了“怀孕，出生，毕业，结婚”四个阶段。如果在我们点击网页链接的时候能够意识到这个过程而不是简单的请求-响应的话，我们便可以挖掘出很多细节上可以提升性能的东西。今天听了淘宝小马哥的一个对yahoo开发团队对web性能研究的一个讲座，感觉收获很大，想在blog上做个分享。优化网站性能的14条军规快速提高网站访问速度，更多内容如下：相信很多人都听过优化网站性能的14条规则。 1. 尽可能的减少 HTTP 的请求数 [content] 2. 使用 CDN（Content Delivery Network） [server] 3. 添加 Expires 头(或者 Cache-control ) [server] 4. Gzip 组件 [server] 5. 将 CSS 样式放在页面的上方

JQ选择器

阅读更多关于 JQ选择器

1.#id 查找ID 为myDIV的元素 <body> <div class="mydiv"><p> I am little D!</p></div> <div class="opl"> <p>小弟</p> </div> <script src="../js/jquery-3.1.0.min.js"></script> <script type="text/javascript"> console.log($(".mydiv")); </script> </body> 2.element 用于搜索的元素指向DOM节点的标签名 <body> <div>div</div> <div>div2</div> <span>span</span> <script src="../js/jquery-3.1.0.min.js"></script> <script type="text/javascript"> console.log($("div")); </script> </body> 3. .class 获取类 <div class="notMe">div class="notMe"</div> <div class="myClass">div class="myClass"</div> <span class="myClass">span class="myClass"</span>

css选择器总结

阅读更多关于 css选择器总结

CSS1选择器选择器解释说明 E 类型选择器选择指定类型的元素(指定标签) E#myid ID选择器 id等于myid的E元素,E若省略则表示id等于myid的任意元素 E.class 类选择器所有class等于指定class的E元素.若E省略E的用处同上 E F 包含选择器选择包含在E元素中的F元素.E和F可以是其它选择器,如:E.abc F.cde a:link 链接伪类匹配已定义了href属性的a元素 a:visited 链接伪类匹配已访问过的a元素 E:active 用户操作伪类选择被激过的E元素,如被鼠标按住 E:hover 用户操作伪类正被鼠标经过的E元素 E:focus 伪选择器匹配获得焦点的E元素 E::first-line 伪选择器 E元素内的第一行文本 E::first-letter 伪选择器匹配E元素内的第一个字符 CSS2选择器选择器解释说明 * 通配选择器选择文档中所有的元素 E[foo] 属性选择器匹配E元素,且它定义了foo属性,若E省略,则表示所有定义了foo属性的任意元素 E[foo=”bar”] 属性选择器匹配E元素,且它定义了foo属性,且值是bar,E省略的情况同上 E[foo~=”bar”] 属性选择器匹配E元素,且它的foo属性中有bar,如:<a title=”bar bar1 bar2”></a

css选择器四大类：基本、组合、属性、伪类

阅读更多关于 css选择器四大类：基本、组合、属性、伪类

什么是选择器？选择器的作用是通过它可以找到元素，把css样式传递给元素！css选择器主要分为：基本选择器、属性选择器、组合选择器与伪类选择器四个大类！ css基本选择器基本选择器又分为：*通配符、标签选择器、class选择器、id选择器，在这里需要注意的编程思想在css层叠样式表中元素有且仅有一个id。注意以下几点1.id唯一性2.元素id不相同，就像每一个人只有一个身份证一样，ID就代表身份证3.class选择器不具有唯一性，它可以重复使用！此外这个*通配符代表的是全局 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>css基本选择器</title> 7 <style type="text/css"> 8 *{ 9 color: skyblue; 10 }/**通配符*/ 11 div{ 12 color: red; 13 }/*标签选择器*/ 14 .box{ 15 color: steelblue; 16 }/*class选择器*/.box{color: steelblue;}也可以写成*.box{color:

javaweb-css

阅读更多关于 javaweb-css

本文着重介绍 CSS( 在网上搜集的笔记是跟 html 在同一天讲完的 , 但是这样太草率 , 所以我把 css 单独列出来 , 毕竟是装修装饰的玩意 , 多了解一点 , 人靠衣装嘛 ) CSS 1 、 css 的简介（ 1 ）什么是 css ？层叠样式表 * 样式表：有很多的属性和属性值，来设置内容样式 * 层叠：一层一层的，样式的优先级。 ** 优先级 : 由上至下 , 就近原则最终目的 : 把网页的内容和样式进行分离 , 利于代码的后期维护 * 想要使用 css ，不能单独使用，要和 html 结合使用 * css 和 html 的如何结合使用。 2 、 css 和 html 的结合方式（ 1 ） css 和 html 有四种结合方式第一种：使用 html 标签里面的属性 style="css 的代码 " ( 不推荐 , 因为太乱 ) * 代码 <div style="color:blue;"> 第二种：使用 html 的标签 ( 这种用得比较多 ) * <style type="text/css"> css 的代码 ; </style> * 代码 <style type="text/css"> div { color:black; } </style> 第三种：使用 html 标签实现 link ，写在 head 里面 ( 外部样式表 , 用的也挺多 ) *

CSS的总结(选择器,伪类等...)

阅读更多关于 CSS的总结(选择器,伪类等...)

关于组合选择器可参考: http://www.cnblogs.com/starof/p/4453458.html 主要内容 CSS概述 CSS和HTML结合的四种方式 CSS样式优先级和代码规范 CSS三种常用选择器 CSS三种扩展选择器 CSS的常见操作 CSS概述 CSS （Cascading Style Sheet）是层叠样式表.作用来定义网页的显示效果。简单一句话：CSS将网页内容和显示样式进行分离，提高了显示功能。 CSS的优点 1：CSS可以更加精细的控制网页的内容形式。比如说前面的font标签中的size属性，可以用于控制文字的大小，但是，它控制的字体只有7级。要是出现其他级别的文字，它就实现不了，而css可以办到，它可以任意设置字体的大小。 2：CSS样式是丰富多彩的。 3：CSS的样式定义是灵活多样的。 CSS和HTML结合的方式 sytle属性方式(行内样式) style标签方式(内嵌样式) 导入方式链接方式 A：style属性方式：利用标签中style属性来改变每个标签的显示样式。例： <p style="background-color:#FF0000; color:#FFFFFF"> 　　 p标签段落内容。 </p> 该方式比较灵活，但是对于多个相同标签的同一样式定义比较麻烦，适合局部修改。 B：style标签方式：（内嵌方式）

CSS（02）CSS选择器

阅读更多关于 CSS（02）CSS选择器

一、元素（类型）选择器最常见的 CSS 选择器是元素选择器。换句话说，文档的元素就是最基本的选择器。如果设置 HTML 的样式，选择器通常将是某个 HTML 元素，比如 p、h1、em、a，甚至可以是 html 本身： html {color:black;} h1 {color:blue;} h2 {color:silver;} 亲自试一试在 W3C 标准中，元素选择器又称为类型选择器（type selector）。 “类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。” 因此，我们也可以为 XML 文档中的元素设置样式： XML 文档： <?xml version="1.0" encoding="ISO-8859-1"?> <?xml-stylesheet type="text/css" href="note.css"?> <note> <to>George</to> <from>John</from> <heading>Reminder</heading> <body>Don't forget the meeting!</body> </note> CSS 文档： note { font-family:Verdana, Arial; margin-left:30px; } to { font-size:28px; display:

CSS选择器、盒子模型、浮动与定位等详解

阅读更多关于 CSS选择器、盒子模型、浮动与定位等详解

文章目录一、CSS 1、学习目标 1.1、什么是CSS 1.2、CSS样式的两种写的方法 1.3、CSS的3种导入方式 2、选择器（重要） 2.1、基本选择器 2.2、层次选择器 2.3、结构伪类选择器 2.4、属性选择器 3、美化网页元素 3.1、为什么美化网页 3.2、字体样式 3.3、文本样式 3.4、阴影 3.5、超链接伪类 3.7、背景 4、盒子模型 4.1、什么是盒子模型 4.2、边框 4.3、内外边距 4.4、圆角边框 4.5、盒子阴影 5、浮动 5.2、display 5.3、float 5.4、父级边框塌陷问题 6、定位 6.1、相对定位 6.2、绝对定位 6.3、固定定位 6.4、z-index 一、CSS 1、学习目标 CSS的作用及简单使用（入门） CSS选择器（重难点）美化网页盒子模型浮动与定位网页动画 1.1、什么是CSS CSS：层叠级联样式表（Cascading Style Sheet），作用是为了美化网页，给网页增添样式，包括字体、颜色、位置、背景图、定位与浮动等 CSS发展史： CSS1.0 CSS2.0：DIV（块） + CSS，产生了HTML 与 CSS 结构分离的思想，让网页变得简单 CSS2.1：增添浮动，定位 CSS3.0：增添圆角，阴影，动画…. 浏览器兼容性更好 1.2、CSS样式的两种写的方法

CSS选择器

阅读更多关于 CSS选择器

CSS的一个核心特性是能向文档中的一组元素类型应用某些规则，本文将详细介绍CSS选择器通配选择器星号*代表通配选择器，可以与任何元素匹配 *{color: red;} 元素选择器文档的元素是最基本的选择器 html{color: black;} p{color: gray;} h2{color: silver;} 类选择器类选择器用于选择一类元素 .div{color: red;} 1、多类选择器 .div1.div2{color: red;} 2、结合元素的类选择器 p.div{color: red;} ID选择器 ID选择器用于选择一个元素 #test{color: red;} 注意：在实际中，浏览器并不会检查ID的唯一性，设置多个ID，可以为这些具有相同ID的元素应用相同样式，但在编写DOM脚本时只能识别该id的第一个元素。 1、结合元素的ID选择器 div#test{color: red;} 属性选择器属性选择器根据元素的属性及属性值来选择元素(IE6-不支持) 1、简单属性选择器 h1[class]{color: red;} img[alt]{color: red;} a[href][title]{color: red;} #div[class]{color: red;} .box[id]{color: red;} [class]{color: red;} 2

订阅 css第一个元素