jQuery CSS()方法改变现有的CSS样式表

使用CSS()方法改变现有的CSS样式表，css()方法在使用上具有多样性。其中有一种可接受两个输入参数：样式属性和样式值，两者之间用逗号分隔。比如要改变链接颜色，可以这样编写代码：

$("#61dh a").css('color','#123456');
//选择器‘$("#61dh a")'表示ID为‘#61dh'的元素下的所有链接。
//.css(‘color','#123456');表示把颜色设为'#123456'

如果需要改变多个样式属性，可先定义属性变量，然后直接赋值给css()方法。

var mycss = {
background: '#EEE',
width: '478px',
margin: '10px 0 0',
padding: '5px 10px',
border: '1px solid #CCC'
};
$("#result").css(divcss);

上述代码先定义了一个CSS样式属性变量“mycss”，类似于建立一个外部CSS文件，之后通过css()方法，把属性赋给ID为'#result'的DIV。
另外jQuery提供的css()方法还可以查看某个元素的css属性值。（www.jb51.net 脚本学堂）

例如查看链接的颜色，代码如下：

$("#61dh a").css("color")

你会发现，这与第一个例子相似，但是这里只传递一个参数(样式属性)。
最后要介绍的是如何设置鼠标划过后的链接样式(比如: 颜色)，需要用到jQuery事件类方法 - hover()。值得注意的是，hover()方法需要定义两个函数，一个是鼠标划过时；另一个是鼠标划过后。具体方法如下：

$("#61dh a").css('color','#123456');
$("#61dh a").hover(function(){
$(this).css('color','#999');
},
function(){
$(this).css('color','#123456');
});
//hover()方法的两个函数使用用逗号分隔

或许聪明的你已经注意到这种方法称不上简洁，呵呵，其实jQuery hover()方法不是用来改变CSS样式的。在实际运用中，建议使用添加/移出CSS的方法来改变鼠标划过的链接样式。

赞 (0)

相关推荐

  • jQuery - css() 方法示例详解

    css() 方法设置或返回被选元素的一个或多个样式属性. 设置 CSS 属性 如需设置指定的 CSS 属性,请使用如下语法: 复制代码 代码如下: css("propertyname","value"); 下面的例子将为所有匹配元素设置 background-color 值: 实例 复制代码 代码如下: $("p").css("background-color","yellow"); 设置多个 CSS 属性

  • jQuery的css() 方法使用指南

    定义和用法 css() 方法返回或设置匹配的元素的一个或多个样式属性. 返回 CSS 属性值 返回第一个匹配元素的 CSS 属性值. 注释:当用于返回一个值时,不支持简写的 CSS 属性(比如 "background" 和 "border"). 复制代码 代码如下: $(selector).css(name) name 必需.规定 CSS 属性的名称.该参数可包含任何 CSS 属性.比如 "color". 实例 取得第一个段落的 color 样式

  • jQuery CSS()方法改变现有的CSS样式

    jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔.比如要改变链接颜色,可以这样编写代码: $("#61dh a").css('color','#123456'); //选择器'$("#61dh a")'表示ID为'#61dh'的元素下的所有链接. //.css('color','#123456');表示把颜色设为'#123456' 如果需要改变多个样式

  • jQuery的css()方法用法实例

    本文实例讲述了jQuery的css()方法用法.分享给大家供大家参考.具体分析如下: 此方法返回或设置匹配元素的一个或多个样式属性. 语法结构: 语法一: 取得指定样式属性的属性值. 以样式属性名称作为参数.例如: 复制代码 代码如下: $("div").css("color") 以上代码能够获取div的字体颜色值. 代码实例: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta c

  • jQuery css() 方法动态修改CSS属性

    我们先来看个实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>添加和删除类</title> <style> div{width: 500px;height: 500px;background: #1c94c4;} button{width: 80px;height: 40px;margin

  • jQuery使用CSS()方法给指定元素同时设置多个样式

    本文实例讲述了jQuery使用CSS()方法给指定元素同时设置多个样式的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $(

  • jQuery CSS()方法改变现有的CSS样式表

    使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔.比如要改变链接颜色,可以这样编写代码: $("#61dh a").css('color','#123456'); //选择器'$("#61dh a")'表示ID为'#61dh'的元素下的所有链接. //.css('color','#123456');表示把颜色设为'#123456' 如果需要改变多个样式属性,可先定义属性变量

  • 发现四种在网页中使用CSS样式表的方法

    如何在网页中插入CSS 前面我们了解了CSS的语法,但要想在浏览器中显示出效果,就要让浏览器识别并调用.当浏览器读取样式表时,要依照文本格式来读,这里介绍四种在页面中插入样式表的方法:链入外部样式表.内部样式表.导入外表样式表和内嵌样式. 1. 链入外部样式表  链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用< link >标记链接到这个样式表文件,这个标记必须放到页面的< head >区内,如下:  复制代码 代码如下: <head>   --   &l

  • JavaScript CSS修改学习第三章 修改样式表

    请注意代码和传统的DHTML的区别.在DHTML你通过直接修改页面上的特定元素来改变样式,而这里的代码修改的是样式表.在这里查看W3C DOM-CSS的兼容性列表.定义 一个页面总是包含一个或者几个样式表,一个样式表里面包含一条或者几条规则,一条规则里有详细的样式声明.这个页面的样式表如下: 复制代码 代码如下: <link rel="stylesheet" href="../quirksmode.css"> <style> <!--

  • Jquery使用css方法改变样式实例

    本文实例讲述了Jquery使用css方法改变样式.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &

  • javascript+css 网页每次加载不同样式的实现方法

    [明确需求] 网页加载样式表default.css,会展现默认风格.同时为实现多种风格,制作了skin1.css,skin2.css,skin3.css三种定制样式.如果在加载default.css后,再加载其中某一样式表,则会覆盖默认风格,展示新风格: 每次随机加载skin1.css.skin2.css.skin3.css,或者使用默认风格.需要注意的一点是,随机加载也有可能使这一次和上一次的样式相同. [实现思路] 使用document.write动态向<head />中写入css载入语句

  • jQuery HTML css()方法与css类实例详解

    本文实例讲述了jQuery HTML css()方法与css类.分享给大家供大家参考,具体如下: jQuery css() 方法 返回 CSS 属性 如需返回指定的 CSS 属性的值,请使用如下语法: css("propertyname"); 下面的例子将返回首个匹配元素的 background-color 值: $("p").css("background-color");//只获取 了一个背景颜色 //获取多个 <body> &l

随机推荐