当前位置:  编程技术>jquery

jquery css方法改变css样式用法介绍

    来源: 互联网  发布时间:2014-10-08

    本文导语:  使用css()方法改变现有的css样式表,css()方法在使用上具有多样性。 其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔。 例子,改变链接颜色:   代码示例: $("#61dh a").css('color','#123456');  //选择器‘$...

使用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. 脚本学堂 整理)

例如,查看链接的颜色:
 

代码示例:
$("#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的方法来改变鼠标划过的链接样式。


    
 
 

您可能感兴趣的文章:

  • JS与jquery自定义属性用法
  • jQuery setTimeout()函数的用法介绍
  • jQuery :visible 选择器(冒号)的用法
  • JQuery 判断某个属性是否存在hasAttr用法
  • jquery onpropertychange键盘事件用法举例
  • jQuery setTimeout用法总结(实例)
  • Jquery confirm弹出框的用法
  • docker中文入门学习手册 iis7站长之家
  • Jquery中slideToggle()与toggleClass()用法
  • Jquery 过滤器(first,last,not,even,odd)用法举例
  • jquery 字符串切割函数substring的用法说明
  • jquery判断浏览器类型($.browser用法)
  • jquery css类用法(添加、修改与删除css)
  • jquery中show()、hide()方法的用法
  • 有关jquery一些选择器的用法小结
  • Jquery中ajax方法data参数的用法小结
  • jquery中each的用法分享
  • jquery .attr()与.prop()用法解析
  • jquery插件jTimer jquery定时器的用法举例
  • jquery操作HTML5 的data-*的用法实例分享
  • jquery 设置文本框、密码框获得焦点时的样式
  • jQuery样式插件 jqTransform
  • textarea显示成label的样式 jquery实例
  • JQuery如何为元素添加样式
  • jquery获取样式中background-color颜色值
  • jquery 获取dom固定元素 添加样式的简单实例
  • jQuery CSS()方法改变现有的CSS样式
  • 浅析JQuery UI Dialog的样式设置问题
  • jQuery操作元素css样式的三种方法
  • JQuery中操作Css样式的方法
  • jquery操作css样式表文件的方法详解
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jQuery实现CSS3动画效果的插件 jQuery Transit
  • jQuery添加/改变/移除CSS类及判断是否已经存在CSS
  • jQuery图片自动放大插件 Greyscale Hover Effect w/ CSS & jQuery
  • jquery控制css的display属性(显示与隐藏)
  • jQuery Multi Level horizontal CSS Menu
  • jQuery设置CSS属性(示例)
  • jquery控制css display属性(控制元素显示与隐藏)
  • jQuery Multi Level CSS Menu
  • jQuery - css() 方法示例详解
  • jQuery 设置 CSS 属性示例介绍
  • Jquery css方法的例子
  • jQuery加载或调用CSS文件的例子
  • jquery控制css元素的display(显示与隐藏)属性
  • jQuery修改CSS伪元素属性的方法
  • jquery css 设置table的奇偶行背景色示例
  • jquery与css实现返回顶部的效果代码
  • jquery修改网页背景颜色通过css方法实现
  • jquery css 选择器的实现代码
  • jquery动态调用css文件方法示例
  • jquery按需加载js与css的插件
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery圆角插件 jQuery Corners
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3