`
qiannianhua
  • 浏览: 18071 次
社区版块
存档分类
最新评论

使用jQuery改变css样式

 
阅读更多

       我们在做订餐大师的时候需要修改CSS的样式,其实我们可以修改CSS类或直接修改元素的样式;

        当然,修改元素的属性可以用很多种方法,其中使用jQuery可以让它变的及其简单;

      下面我们来修改CSS的样式:css()方法返回或设置匹配的元素的一个或多个样式属性;

1、首先引入jQuery文件:

<script type="text/javascript" src="/jquery/jquery.js"></script>

 2、设置CSS样式:

<script type="text/javascript">
    $("p").css("color","red");
</script>
<body>
    <p>改变段落字体颜色,变为红色</p>
</body>

    输出结果为: 

改变段落字体颜色,变为红色

 3.也可以用添加类的方法:

<script type="text/javascript">
    $("p").addClass("blue");
</script>
<script>
    .blue{
           color:blue;    
     }
</script>
<body>
    <p>改变段落字体颜色,变为蓝色</p>
</body>

  输出结果为:

改变段落字体颜色,变为蓝色

 

 

 

分享到:
评论
1 楼 liguangsong 2015-12-18  
添加类的方法是addClass, removeClass

相关推荐

    jquery实现动态改变css样式的方法分析

    本文实例讲述了jquery实现动态改变css样式的方法。分享给大家供大家参考,具体如下: jquery 几乎成了现在开发WEB应用的标准JS库,这与其简单性和易用性是分不开的。作为一个后端开发人员,要做一些前端页面时,CSS ...

    jQuery基础 - 改变CSS样式

    jQuery基础 jQuery改变CSS

    jQuery 改变CSS样式基础代码

    比如我们要改变链接颜色,我们可以使用下面的代码: 代码如下: $(“#61dh a”).css(‘color’,’#123456′); //这里选择器‘$(“#61dh a”)’表示ID为‘#61dh’的元素下的所有链接。 //.css(‘color’,’#123456′);...

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

    本文实例讲述了Jquery使用css方法改变样式。分享给大家供大家参考。具体实现方法如下: &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

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

    jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性。其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔。比如要改变链接颜色,可以这样编写代码: $("#61dh a")....

    JQuery&CSS;&CSS;+DIV实例大全.rar

    实用jquery实现鼠标滚轮控制改变文本框数字的插件 21.实用jquery使用ul模拟表单select列表效果 22.实用jQuery无限级导航菜单源码下载 23.适合于网站注册的jQuery用户注册条款插件下载(带特效) 24.提升用户...

    jQuery 无刷新切换CSS样式表改变风格

    内容索引:脚本资源,jQuery,无刷新风格切换 jQuery 无刷新切换网站风格,如果你想在你的网站中加入这项功能,这个实例最适合您了,它使用了jQuery插件,用起来更稳定、省心,你需要准备好多份CSS样式表文件,这和...

    jQuery+CSS3实现ToolTip效果特效代码

    jQuery+CSS3实现ToolTip效果是一款基于jquery+css3实现的七款不同风格效果的ToolTip特效。

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

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

    基于jquery animate操作css样式属性小结

    昨天突然有网友问我animate()方法可以...css中的不是所有属性都可以用Jquery动画(animate函数)来动态改变,下面总结了JQ可以操作元素的一些属性: * backgroundPosition * borderWidth * borderBottomWidth * b

    云台控制器+css+jQuery+canvas

    云台控制器+css+jQuery+canvas(鼠标移入移出,按钮改变样式)

    jQuery实现的点击按钮改变样式功能示例

    本文实例讲述了jQuery实现的点击按钮改变样式功能。分享给大家供大家参考,具体如下: 1. css代码:index4.css @CHARSET "UTF-8"; .sd{ font-weight: bold; color: black; background: red; } 2. jsp代码:...

    鼠标经过网页背景样式改变,jquery效果

    经典鼠标经过网页背景样式改变,鼠标经过jquery效果 鼠标经过css变化 展示页面:http://www.whkge.com/jsview/js0112b/

    JQuery权威指南源代码

    jQuery控制CSS样式 第2章 使用JavaScript实现隔行变色 使用jQuery选择器实现隔行变色 JavaScript代码检测页面元素 jQuery代码检测页面元素 使用jQuery基本选择器 使用jQuery层次选择器 使用jQuery基本过滤...

    JQuery操作元素的css样式

    我们常常要使用Javascript来改变页面元素的样式。其中一种办法是改变页面元 素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的classname特性来实现的;而jQuery里提供三种方法来实现这个功能...

    期末作品网页制作css+js+jquery

    (3) 动态改变导航菜单样式 (4) 制作图片轮显效果 (5) 制作随光标滚动的广告图片效果 (6) 制作光标移到某图片上显示该图片对应大图 (7)制作弹出式广告,并3秒后自动关闭 主题是旅游网站,网页简单不炫酷...

Global site tag (gtag.js) - Google Analytics