css选择器 | 易学教程

css随堂笔记（二）

阅读更多关于 css随堂笔记（二）

css sub注释注释不能嵌套 sub生成结构代码快捷复合选择器 1。后代选择器语法：选择器1 选择器2 选择器3 { 属性名：属性值 } 2.子代选择器子代选择器语法：选择器1>选择器2>选择器3 { 属性名：属性值； } 注意：子代选择器只能选择直接子元素（只能选择儿子） 3.交集选择器交集选择器语法：选择器1选择器2选择器3{ 属性名：属性值； } 注意：如果交集选择器中存在标签选择器，标签选择器一定要写在最前面 4.并集选择器并集选择器语法：选择器1，选择器2，选择器3{ 属性值：属性名； } 注意:并集选择器使用最多的时候是在css样式初始哈。 5.其他选择器伪类选择器用于向某些选择器添加效果分类： 1.链接伪类选择器 2.结构伪类选择器链接选择器：1。：link 链接颜色只对a标签有用 2. ：visited 点击完成后颜色只对a标签有用 3. :hover 鼠标悬停的时候的颜色对所有的元素都有效果 4. :active 鼠标按住的时候的颜色对所有的元素都有效果如果同时使用四个伪类选择器，他们是有顺序的。顺序是： :link :visited :hover :active 结构伪类选择器结构伪类选择器： :first-child 选择第一个子元素 :last-child 选择最后一个子元素 :nth-child(n)

CSS基础

阅读更多关于 CSS基础

什么是 CSS? CSS 指层叠样式表 ( C ascading S tyle S heets) 样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一 CSS 实例 CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明: 选择器通常是您需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成。属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。 CSS Id 和 Class id 和 class 选择器如果你要在HTML元素中设置CSS样式，你需要在元素中设置"id" 和 "class"选择器。 id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。 class 选择器 class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。 class 选择器在HTML中以class属性表示, 在 CSS 中，类选择器以一个点"."号显示：在以下的例子中，所有拥有 center 类的 HTML 元素均为居中如何插入样式表插入样式表的方法有三种:

CSS基础知识

阅读更多关于 CSS基础知识

1. CSS 定义：指层叠样式表 (Cascading Style Sheets)，是一种用来表现 HTML 文档样式的语言，样式定义如何显示 HTML 元素，是能够真正做到网页表现与结构分离的一种样式设计语言。样式通常存储在样式表中，外部样式表通常存储在 CSS 文件中，多个样式定义可层叠为一。 2. CSS 规则：由两个主要的部分构成：选择器，以及一条或多条声明。选择器就是需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成，属性是设置的样式属性（style attribute），每个属性都有一个值，属性和值用冒号分隔。CSS 声明总是以分号 ; 结束，声明组以大括号 {...} 括起来。为了让 CSS 可读性更强，可以每行只描述一个属性。 3. CSS 创建：当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。CSS 创建样式表有三种方法：行内样式、内部样式、外部样式。（1）行内样式：内联样式也叫行内样式或者行间样式，即在相关标签内使用样式（style）属性定义。如下： <div style="width:200px;height:100px;border:1px solid black;"></div> （2）内部样式：内部样式也叫内嵌样式，即在文档中创建内嵌的样式表，需要使用 <style> 标签在文档头部定义内部样式表，

HTML CSS的引入方式和css选择器

阅读更多关于 HTML CSS的引入方式和css选择器

HTML中CSS的引入的四种方式 1. 在HTML中head中通过style标签引入，直接将样式写到style中，如下图 2. 在HTML中通过 link标签引入.css文件，这种方式的引入可以一个css文件的控制多个html mycss.css文件为已经写好的样式,如下图在HTML文件中引入已经写好的样式文件mycss.css，控制html的样式显示：如下图 3.通过@import导入的方式引入css文件，这种方法在渲染的页面的时会先展示无样式的面，再显示样式。一般不用： 4.引入样式的方式直接在标签中直接通过属性控制样式显示。 CSS中选择器： 1.通用选择器：用*{} html中所有的标签都生效； 2.标签选择器：根据标签名字进行选择，所有的该名字的标签生效； 3.id选择器 4.class选择器 5.组合选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ color: red; background-color: burlywood; font-size: 50px; } div{ color: yellow; background-color: aliceblue; font-size: 16px; } #div1{

CSS的了解（三）

阅读更多关于 CSS的了解（三）

一、CSS权重问题（256进制） ! important Infinity(正无穷) 行间样式 1000 id 100 class/属性选择器/伪类选择器 10 标签选择器/伪元素 1 通配选择器 0 二、复杂选择器 1、父子选择器/派生选择器只要两者存在直接或者父子级关系都可以使用，而且不一定要用标签写，也可用属性值来写，浏览器真正辨别父子选择器的顺序是自右向左在lesson4.2.html中写 <html lang= "en" > <head> <meta charset= "utf-8" > <title>Document</title> <link rel= "stylesheet" type= "text/css" href= "lesson4.2.css" > </head> <body> <div> <span>你好</span> </div> <span>新年好</span> </body> </html> 在lesson4.2.css中写（父+子） div span { background-color : blue } 2、直接子元素选择器和父子选择器差不多，父子关系比较直接的一级在lesson4.2.html中写 <html lang= "en" > <head> <meta charset= "utf-8" > <title>Document<

Web_jQuery

阅读更多关于 Web_jQuery

第1章： jQuery简介为了简化 JavaScript 的开发，一些 JavsScript 库诞生了。 JavaScript库封装了很多预定义的对象和实用函数，简化HTML与JavaScript之间的操作，能帮助使用者建立有高难度交互的页面，并且兼容各大浏览器。当前流行的 JavaScript 库有 jQuery是继prototype之后又一个优秀的JavaScript框架。如今， jQuery已经成为最流行的JavaScript库。在世界前10000个访问最多的网站中，有超过55%在使用jQuery。 jQuery，顾名思义，也就是JavaScript和查询（query），其宗旨是“WRITELESS,DO MORE”，极大地简化了JavaScript开发人员遍历HTML文档，操作Dom，处理时间，执行动画和开发Ajax，具体来说，优势如下 jQuery是免费、开源的轻量级(压缩后只有几十k) 强大的选择器出色的 DOM 操作的封装可靠的事件处理机制完善的 Ajax使用出色的多浏览器兼容性隐式迭代：对集合对象做相同操作时不需要逐个进行遍历，jQuery自动进行遍历文档说明很全可扩展插件第2章：jQuery快速入门 jQuery库实际上就是一个js文件，只需要在网页中直接引入这个文件就可以了。将jQuery的库文件加入在开发测试时,

jquery学习（3）--高级选择器

阅读更多关于 jquery学习（3）--高级选择器

自己手写的学习笔记。常规选择器： /****************学习--高级选择器（1）****************/ ---高级选择器：ie7+ 层次选择器：后代选择器 ul li a $('ul li a') 获取追溯到的多个dom对象 ie6+= 子选择器 div>p $('div p') 只获取子类节点的多个dom对象 ie7+ next选择器 div+p{} $('div+p') 只获取某节点后的同一个同级对象 ie7+ nextAll选择器 div~p{} $('div~p') 获取某节点后面的所有同级的dom对象 ie7+ 在层次选择其中，除了后代选择器外。其他的三种高级选择器不支持ie6的,jquery却是兼容ie6的、 //1.后代选择器--》全兼容 $('#box p').css('color','#666'); //jquery为后代选择器提供了一个等价的find()方法 $('#box').find('p').css('color','#666'); //2.子选择器,孙子级失效。只支持一层子级（儿子级）。 #box>p{ color:red;}//css代码，不支持ie6 $('#box>p').css('color','orange');//jquery兼容ie6 //jquery为子选择器提供了一个等价children()方法。 $('

jQuery常规选择器

阅读更多关于 jQuery常规选择器

jQuery最核心的组成部分就是：选择器引擎。它继承了CSS的语法，可以对DOM元素的标签名、属性名、状态等进行快速准确的选择，并且不必担心浏览器的兼容性。jQuery选择器实现了CSS1~CSS3的大部分规则之外，还实现了一些自定义的选择器，用于各种特殊状态的选择。一．简单选择器(ID选择器) 在使用jQuery选择器时，我们首先必须使用“$()”函数来包装我们的CSS 规则。而CSS规则作为参数传递到jQuery对象内部后，再返回包含页面中对应元素的jQuery对象。随后，我们就可以对这个获取到的DOM节点进行行为操作了。 #box { //使用ID选择器的CSS规则 color:red; //添加一个样式color:red } 在jQuery选择器里，我们使用如下的方式获取同样的结果： $(function () { $('#box').css('color','blue'); //添加一个行为css('color','blue')，这个行为是添加样式 }); 那么除了ID选择器之外，还有两种基本的选择器，分别为：元素标签名和类(class)： (1)元素名选择器获取所有div元素的DOM对象，CSS模式：div {} ，jQuery模式：$('div') <body> <div>常规选择器</div> <div>常规选择器</div> <div>常规选择器</div> <

css常用标签（1）

阅读更多关于 css常用标签（1）

1.css背景样式 background-color 背景色 background-image 背景图 url（背景地址）默认水平垂直都铺满 background-repeat 平铺方式 repeat-x repeat-y repeat（x，y都平铺） no-repeat 都不平铺 background-position ：背景位置 x y：number|单词 x : left,center,right y：number : top,center,bottom background-attachment : 背景图随滚动条移动的方式 scroll ：默认值（背景位置是按照当前元素进行偏移的） fixed ：（背景位置是按照浏览器进行偏移的） 2.css边框样式 border-style ：边框样式 solid : 实线 dashed ：虚线 dotted : 点线 border-width ：边框大小 px ... border-color : 边框颜色 red #f00000 ... 边框也可以针对某一边进行单独设置：border-left-style：中间是方向 left、right、top、bottom 颜色：透明色 transparent 3.css文字样式 font-family ：字体类型英文、中文衬线体、非衬线体注意点： 1.多个字体类型设置的目的 2

前端-JQuery

阅读更多关于前端-JQuery

jQuery jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互，能够极大地简化JavaScript编程。它的宗旨就是：“Write less, do more.“ jQuery的优势一款轻量级的JS框架。jQuery核心js文件才几十kb，不会影响页面加载速度。丰富的DOM选择器,jQuery的选择器用起来很方便，比如要找到某个DOM对象的相邻元素，JS可能要写好几行代码，而jQuery一行代码就搞定了，再比如要将一个表格的隔行变色，jQuery也是一行代码搞定。链式表达式。jQuery的链式操作可以把多个操作写在一行代码里，更加简洁。事件、样式、动画支持。jQuery还简化了js操作css的代码，并且代码的可读性也比js要强。 Ajax操作支持。jQuery简化了AJAX操作，后端只需返回一个JSON格式的字符串就能完成与前端的通信。跨浏览器兼容。jQuery基本兼容了现在主流的浏览器，不用再为浏览器的兼容问题而伤透脑筋。插件扩展开发。jQuery有着丰富的第三方的插件，例如：树形菜单、日期控件、图片切换插件、弹出窗口等等基本前端页面上的组件都有对应插件，并且用jQuery插件做出来的效果很炫

订阅 css选择器