css选择器

jQuery 知识点梳理 一、 jquery选择器 基本选择器 ID选择器 类选择器 标记选择器 分组选择器 通配符选择器 层次选择器 $(“ancestor descendent”)：祖先后代选择器 空格 $(“parent > child”)：父子选择器 大于 $(“prev + next”)：相邻后兄弟元素选择器 加号 $(“prev ~ siblings”)：所有后兄弟元素选择器 波浪线 过滤选择器：基本过滤选择器 ：first、:last、:odd、:even、:eq(index)、:gt(index)、：lt(index)、not(selector) 过滤选择器：内容过滤选择器 :contains(text)、:empty、:parent、has(selector) 过滤选择器：可见性过滤选择器 ：visible、:hidden 过滤选择器：属性过滤选择器 [attribute]、[attribute=value]、[attribute!=value]、[attribute^=value]、[attribute$=value]、[attribute*=value] 过滤选择器：表单过滤选择器 :checked、:selected :text、：password、:radio、:checkbox、:submnit、:button、:image、:reset、:file、

一.jQuery介绍 　　1.jQuery是一个轻量级的,兼容多浏览器的JavaScript库 　　2.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插件做出来的效果很炫

一.JQuery的插件主要分为3种： 1.封装对象方法的插件。 如JQuery的parent()方法，appendTo()方法，addClass()方法等。 2.封装全局函数的插件。 如JQuery.ajax()，JQuery.trim()方法 3.选择器插件。 二.JQuery的插件机制： i.JQuery提供了两个用于扩展JQuery功能的方法，jQuery.fn.extend()方法和jQuery.extend()方法。前者用于扩展前面的提到的第一种插件，后者用于扩展后两种插件。这两个方法都接收一个类型为Object的参数。 ii.所有的对象方法都应附加到jQuery.fn对象上，所有全局函数都应附加到jQuery对象本身上。 iii.在插件内部，this指向JQuery对象。 iv.插件应结尾加分号，避免压缩带来错误。在开头也最好加分号，避免他人的不规范代码给插件带来影响。 v.插件应该返回一个JQuery对象，以保证插件的可链式操作。除非插件需要返回的是一些需要获取的量。 三.插件示例： 1.封装JQuery对象方法的插件。 下面是一个简单的color插件，主要实现获取和配置元素颜色的功能。 首先创建jquery.color.js文件。 搭好框架： ;(function($){ })(jQuery); 由于是对JQuery对象方法的扩展，采用jQuery.fn

jquery学习 css选择器: 1.ID选择器 $('#box') 2.类选择器 $('.box1') 3.标签选择器 $('div') 4.统配符(*选择器) $('*') 5.群组选择器 $('#box,.box1') 6.后代选择器 $('#box span') 7.组合选择器 $('#box,.box1,p') 8.相邻兄弟选择器 $('#box+div') 9.子元素选择器 $(#box>.box1) 10.后兄弟选择器 $(#box~div) 基本过滤选择器： eq(index)选取索引等于index的元素（index从0开始） gt(index)选取索引大于index的元素 不包括该元素 lt(index)选取索引小于index的元素 不包括该元素 even() 选取所有的偶数 索引从0开始 odd() 选取所有的奇数数 索引从1开始 next() 选取紧邻的下一个同级元素这是一个方法$().next() prev() 选取紧邻的上一个同级元素 not(index) 选取不是类名不是index的元素 内容过滤选择器：contains() 选中包含文本元素 包括父级 祖先级 外部用"" 内部用'' empty 选中不包含子元素和文本的元素 parent() 选中包含子元素和文本的元素 has() 选中含有匹配的元素的元素 属性过滤选择器： [attr] 选取

1.1 jQuery详细介绍 1.1.1 $问题 a) Js命名归法：下划线、字母、$、数字 b) 但是不能以数字作为开头 jQUery的两个变量：$ 和 jQuery jQuery占用了我们两个变量：$ 和 jQuery 1.1.2 js入口函数跟jQuery入口函数的区别： Js的window.onload事件是等到所有内容，以及我们的外部图片之类的文件加载完了之后，才回去执行 jQuery的入口函数 是在 html所有标签都加载之后，就回去执行。 1.2 Js创建对象 三种方式： var obj = {}; var obj1 = new Object(); var obj2 = Object.create(); 1跟2的区别： 推荐使用第一个方式 第二种方式存在效率问题，因为要new对象，会涉及到原型查找的问题。 1.3 jQuery基本选择器 1.3.1 回顾CSS选择器 CSS 选择器回顾 符号 说明 用法 #id Id选择器 #id{ color:red; } .class 类选择器 .class{ //} Element 标签选择器 P { //} * 通配符选择器 配合其他选择器来使用 , 并集选择器 div,p{} 空格 后代选择器 div span{} 选择div下面所有后代的span > 子代选择器 div > span{} + 紧邻选择器 div+p

1，添加背景图片时，背景图片无法完全显现（只显示图片的局部） 利用background-size解决； background: url(gray-tunnel-207153.jpg) no-repeat ; background-size: 100% 100%;//可使图片完全显现 no-repeat设置图片形式不重叠，当图片宽度不大时，若不设置no-repeat有可能相当于两张相同图片并列显示。 2.插入背景图片，图片随所在块的文本宽度改变而改变 　　为此块定义指定的 width height; .header{ width:360px; height:300px; background: url(mm.jpg); background-size: 100% 100%; margin-top: 100px; } 3去除链接的下划线 　　text-deceration:none; 4.将图片设置成圆形 　　设置borderr-radius的百分比。要得到圆形，需图片为正方形，若图片为长方形得到的会使之变成椭圆。 5.利用@media实现pc端和手机端两套视口的变化 　　写两套css，一套针对手机端，另一套针对pc端，用media进行选择·。 @media only screen and (max-width:768px){} @media only screen and (min

CSS 简介 CSS 概述 CSS 指层叠样式表 ( C ascading S tyle S heets) 样式定义 如何显示 HTML 元素 样式通常存储在 样式表 中 把样式添加到 HTML 4.0 中，是为了 解决内容与表现分离的问题 外部样式表 可以极大提高工作效率 外部样式表通常存储在 CSS 文件 中 多个样式定义可 层叠 为一 样式解决了一个普遍的问题 HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。 由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。 为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。 所有的主流浏览器均支持层叠样式表。 样式表极大地提高了工作效率 样式表定义如何显示 HTML 元素，就像 HTML 3.2 的字体标签和颜色属性所起的作用那样。样式通常保存在外部的 .css 文件中。通过仅仅编辑一个简单的

1、对WEB标准以及W3C的理解和认识？ 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率 使用外链css和js脚本， 结构行为表现的分离 文件下载与页面速度更快，内容能被更多的用户所访问，内容能被更广泛的设备所访问 更少的代码和组价，容易维护，改版方便，不需要变动页面内容 提供打印版本而不需要复制内容、提高网站易用性。 2、xml和html有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言 最主要的不同是： XHTML元素必须被正确地嵌套 XHTML元素必须被关闭 标签名必须用小写 XHTML文档必须拥有根元素 3、doctype（文档类型）的作用是什么？你知道多少种文档类型？ 　　作用是：此标签可以告知浏览器文档使用哪种HTML或XHTML规范 　　此标签可声明三种DTD类型，分别表示严格版本、过渡版本以及基于框架的HTML文档 HTML4.01规定了三种文档类型：Strict、Transition以及Frameset XHTML1.0 规定了三种XML文档类型：Strict、Transitional以及Frameset Standards（标准）模式（也就是严格呈现模式）用于呈现遵循最新标准的网页，而Quirks（包容）模式（也就是松散呈现模式或者兼容模式）用于呈现为传统浏览器而设计的网页 4、行内元素有哪些？块级元素有哪些

1 jQuery选择器 jQuery选择器用于选择DOM元素进行相应操作,允许通过多种方式选择,包括标签名,属性名,类名,id等对元素进行选择,基于CSS选择器.jQuery中所有的选择器都以$符号开头,后面加一对括号. jQuery选择器可以分为基本选择器,层次选择器,过滤选择器与表单选择器. 2 基本选择器 基本选择器可以分成四个: id选择器 元素选择器 类选择器 通配符选择器 组合选择器 2.1 id选择器 id选择器根据给定的id匹配一个元素,以 # 开头,如有: <div id="div1"></div> 则选择器 $("#div1") 会选择 如果id中含有特殊字符,比如点: <div id="div1.1.1"></div> 则需要使用双反斜杠转义: $("#div1\\.1\\.1") 2.2 元素选择器 根据元素的标签名查找所有符合的元素.假设有: <div>1</div> <div>2</div> <div>3</div> 选择器 $("div") 会选择所有div元素. 2.3 类选择器 根据给定的css类名匹配元素,以 . 开头.如有: <div class="class1"></div> <p class="class1"></p> <div class="class2"></div> 选择器 $(".class1") 会选择: 选择器 $("

id 选择器 HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。 #para1 { text-align:center; color:red; } ID属性不要以数字开头，数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。 class 选择器 class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。 class 选择器在HTML中以class属性表示, 在 CSS 中，类选择器以一个点"."号显示： .center {text-align:center;} 你也可以指定特定的HTML元素使用class。 p.center {text-align:center;} 类名的第一个字符不能使用数字！它无法在 Mozilla 或 Firefox 中起作用。 来源： https://www.cnblogs.com/lyan/p/9890379.html