如何在DIV行上改变背景颜色？(Jquery和/或CSS) - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

jQuery 选择器使用方法

> child（直系子元素） $('#divOne > p').css('color', 'blue'); 下面的代码，只有外层段落的字体会改变颜色，里层不会，因为里层是属于 divInner 的直系元素...） $('tr:even').css('background', 'red'); // 偶数行颜色 $('tr:odd').css('background', 'blue'); // 奇数行颜色偶数行行颜色为红色...('background', 'red'); // 偶数行颜色 $('tr:odd').css('background', 'blue'); // 奇数行颜色 ...:eq(x) （取指定索引的元素） $('tr:eq(2)').css('background', 'yellow'); // 表格第二行变色 :gt(x)和:lt(x)（取大于x索引或小于x索引的元素...:45px;">点我改变颜色 div class="div-1" style = 'display: none'>div-1div> div class="div-

5.2K1 0

jQuery 选择器使用方法

> child（直系子元素） $('#divOne > p').css('color', 'blue'); 下面的代码，只有外层段落的字体会改变颜色，里层不会，因为里层是属于 divInner 的直系元素...） $('tr:even').css('background', 'red'); // 偶数行颜色 $('tr:odd').css('background', 'blue'); // 奇数行颜色偶数行行颜色为红色...('background', 'red'); // 偶数行颜色 $('tr:odd').css('background', 'blue'); // 奇数行颜色 ...:eq(x) （取指定索引的元素） $('tr:eq(2)').css('background', 'yellow'); // 表格第二行变色 :gt(x)和:lt(x)（取大于x索引或小于x索引的元素...:45px;">点我改变颜色 div class="div-1" style = 'display: none'>div-1div> div class="div-

5.1K1 0

您找到你想要的搜索结果了吗？

是的

没有找到

与Ajax同样重要的jQuery（1）

黄色 ² 设置表格偶数行背景色绿色 ² 设置页面中所有标题显示为灰色 ² 设置页面中正在执行动画效果div背景黄色，不执行动画div背景绿色 css("color","blue"); // 设置表格奇数行背景色黄色 /设置表格偶数行背景色绿色 $("tr:even").css("background-color","yellow"); $...参数 speedString,Number三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000) callback (可选)Function...字体颜色为红色 ² 表格奇数行背景色黄色 ² 表格偶数行背景色灰色 ² 只有一个td的 tr元素字体为蓝色颜色为红色 $("#mytable tr:nth-child(3n)").css("color","red"); // 表格奇数行背景色黄色 / 表格偶数行背景色灰色 $("table

11.5K6 0

js与jQuery的区别以及jQuery选择器和方法的使用

并集：selector1,selector2,用逗号隔开交集：selector1 selector2 用空格隔开下面我们用代码分别实现一下不同选择器实现效果的方式：案例2：使用基本选择器改变元素背景色和字体颜色...现在我们是不是要设置所有div的背景颜色。那么我们可不可以直接根据div标签来设置。...现在我们要同时设置两个属性，背景色和字体颜色。那么这种同时要设置多个样式时格式该咋写？...现在呢，我想只改变第一个p 这几个字的颜色，大家来看一下该怎么写？...even的意思是偶数 $("ul li:even").css("color","pink"); 获取某一范围元素: :gt 大于现在我们来试一下让大于第一行的li背景色全部改变: $("ul li:gt

16.7K1 0

jQuery入门基础——选择器

并集：selector1,selector2,用逗号隔开交集：selector1 selector2 用空格隔开下面我们用代码分别实现一下不同选择器实现效果的方式：案例2：使用基本选择器改变元素背景色和字体颜色...现在我们是不是要设置所有div的背景颜色。那么我们可不可以直接根据div标签来设置。...现在我们要同时设置两个属性，背景色和字体颜色。那么这种同时要设置多个样式时格式该咋写？...现在呢，我想只改变第一个p 这几个字的颜色，大家来看一下该怎么写？...even的意思是偶数 $("ul li:even").css("color","pink"); 获取某一范围元素: :gt 大于现在我们来试一下让大于第一行的li背景色全部改变: $("ul li:gt

10.5K2 0

【前端基础篇】JavaScript之jQuery介绍

属性 css()⽅法设置或返回被选元素的⼀个或多个样式属性代码⽰例：获取元素属性 div style="font-size: 36px;">我是⼀个⽂本div> $...(): 获取或设置CSS属性，能够动态地改变元素的样式，是实现动态交互效果的重要工具。...); // 打印出背景颜色属性的值 // 设置CSS属性 $("#elementId").css("background-color", "blue"); // 此时，#elementId 元素的背景颜色会变为蓝色...#inputId 输入框时，背景颜色会变为黄色 blur(): 当元素失去焦点时触发，通常用于验证用户输入。...，背景颜色会恢复为白色 hover(): 当鼠标悬停在元素上时触发两个不同的函数，分别用于鼠标移入和移出。

3.2K1 0

看不完的那种！前端170面试题+答案学习整理（良心制作）

7.css3动画如何在动作结束时保持状态不变使用animation-fill-mode，值为none，表示不改变默认行为；值为forwards，当动画完成后，保持最后一个属性值；backwards，在...的区别 background-clip规定背景，背景颜色和背景图片的绘制区域。...规定背景图片的定位区域它有三个属性：border-box，padding-box，content-box（它只能对背景做样式上的操作） 12.css3中transition属性值以及含义是 transition...jquery ui则是在jquery的基础上对jquery的扩展，是jquery的插件。jquery ui提供了一些常用的界面元素，如对话框，拖动行为，改变大小行为等。...113.使用jQuery中的动画 hide()和show()可以同时修改多个样式属性，如高度，宽度，不透明度。 fadeIn()和fadeOut()，fadeTo()只能改变不透明度。

13.1K5 0

JavaWeb——JQuery之DOM操作应用及实践案例总结（DOM内容操作、DOM属性操作、CRUD操作）

("one")，若元素对象上存在class="one"，则将属性值one删除，否则添加；【案例练习】：应用以上方法获取或设置属性背景颜色 $("#b5").click(function () { var backgroundColor = $("#one...()设置id为one背景颜色为绿色 $("#b6").click(function () { $("#one").css("backgroundColor...()获得id为one背景颜色" id="b5"/> css()设置id为one背景颜色为绿色" id="b6"/> 和B是平级的； 7）insertAfter()：如A.insertAfter(B)，将对象B添加到A的后面，对象A和B是平级的； 8）insertBefore()：如A.insertBefore

3.5K5 0

【Html.js——效果实现】网页 PPT（蓝桥杯真题-2418）【合集】

详细解释全局样式： body：设置页面背景颜色为黑色，去除内外边距。 h1：设置标题的颜色和字体大小。...控制区域样式： .controls：使用 Flexbox 布局，将控制区域固定在页面左下角，设置背景颜色、内边距、阴影和圆角。....btns：使用 Flexbox 布局，设置按钮区域的宽度和子元素的间距。 .btn：设置按钮的宽度、高度、光标样式、背景颜色和边框。 .btn img：设置按钮内图片的宽度和高度。...页码样式： .page：设置页码的颜色和字体。 PPT 页面样式： section：设置 PPT 页面的背景颜色、字体大小、内边距、宽度、高度和定位方式。...section:first-child 和 section:last-child：设置第一页和最后一页的背景颜色、字体大小和布局方式。

9790 0

学习jQuery这一篇就够了

() 方法描述：获取匹配元素集合中的第一个元素的样式属性的计算值或设置每个匹配元素的一个或多个 CSS 属性。...需求描述：设置 div 的背景颜色为红色，字体颜色为白色 div>我是divdiv> $('div').css({ 'background': 'red', 'color': '...white' }); 需求描述：获取 div 的背景颜色和字体颜色并输出 div style="background: red;color: white">我是divdiv> console.log...console.log('浏览器滚动条改变了'); }); # 3.4.2 事件绑定 # 1. on() 方法描述：在选定的元素上绑定一个或多个事件处理函数。...需求描述：创建一个 div，默认 div 宽高 100px，背景颜色为黑色，先让 div 宽度变为 200px，再让 div 高度变为 200px .box { width: 100px;

3.5K5 0

Jump Start Bootstrap 第2章

根据您的设计需求，您可以创建无限数量的行。这些行和列的交点形成了一个矩形网格来包含网站的内容。例如，在图中，我创建了一行，然后使用网格系统把它分成12列。我已经改变了每一列的背景颜色来区分。...为了让我们的列显示清晰，让我们给题目都添加背景颜色。我们在这个项目的CSS目录下，创建一个新的CSS文件styless.css。这不是标准的文件名，你也可以把它命名其他你希望的名字。...css/styles.css" rel="stylesheet"> 让我们在这个文件里添加一些CSS样式，这样每个列有不同的背景颜色。 css文件:col1和col2。这两个类将帮助我们为我们的列提供一些背景颜色。现在，HTML页面应该类似于图2.13的屏幕快照。 ?...这里我调用了styless.css中的样式col3和col4，用于提供背景颜色。 ? 在创建复杂的布局时，可以方便地嵌套列。您还可以进一步嵌套最内部的行，并在其中生成一组新的列。

4.1K4 0

JQuery 入门学习(完结)

f=jquery_hide 运行，可以看到，当鼠标移动到相应的行上的时候，该行变色，当鼠标移走时，颜色恢复。 ? ...因为我们可以看到，鼠标移动到某一行上，只有这一行的颜色会发生变化，我们必须知道鼠标移动到哪一行上了，所以必须获得这个event对象。 ...比如，有的同学直接使用event.target.css('background-color','red')，想这样更改它的背景颜色。这样浏览器是会报错的，错误是td对象不含有css方法。 ...所以大家可以看到，我使用的是DOM中的方法event.target.parentNode.style.backgroundColor，首先用parentNode获得td元素的父元素tr元素（因为我是要一行都改变颜色...，而不是只让鼠标所在的格子改变颜色），再用style属性，改变tr元素的样式。

1.3K1 0

一篇文章带你用jquery mobile设计颜色拾取器

【一、项目背景】现实生活中，我们经常会遇到配色的问题，这个时候去百度一下RGB表。而RGB表只提供相对于的颜色的RGB值而没有可以验证的模块。...导入jQuery Mobile jquery.mobile/jquery.mobile-1.4.5.css" rel="stylesheet" type="text/css">...div> div> 头部显示文字，中部颜色显示区域，尾部显示滑动条。...$(".color").css("background-color",color); //设计内容框背景色 5、调用set_color()。...【六、总结】 1、使更多的人去了解jQuery Mobile， jQuery可以快速找到文档中的html元素，并对其进行操作，如隐藏、显示、改变样式...”。

2K2 0

用Jquery做一个进度条

就是使用javascript和css。首先当然载入Jquery。我这里还用到一个插件：“圆角插件”。...很简单使用，在我们需要其圆角的div上，使用corner方法即可，这里不是重点，我就不多说了。 ...这两行大家可以看到 div id="processbar"> div class="finish">div> div> 其实就是定义了一个div，背景是白色，作为进度条背景...其中又是一个div，作为进度条，背景颜色是#999. 我们之后Jquery的目的就是动态改变进度条宽度，让他慢慢填充背景，最后达到100%。...每次执行，调用css方法，改变finish这个div的宽度。之后i自增。直到i > 100的时候，停止定时器。

2.5K3 1

JQuery的学习

-3.3.1.min.js"> $(function () { //改变div1背景颜色...").css("backgroundColor","pink"); }); //改变索引值为奇数的 div 元素的背景色为...value=" 通过css()设置id为one背景颜色为绿色" id="b6"/> $("#b6").click(function () { $("#one").css...三个预定义的值("slow","normal","fast")或表示动画时长的毫秒数值(如：1000) 2.easing：用来指定切换效果，默认是"swing",可用参数"linear"...//改变div背景色为pink $("#myDiv").css("backgroundColor","pink"); }); });

18.5K2 0

JavaScript（15）jQuery 选择器

jQuery 选择器选择器同意对元素组或单个元素进行操作。 jQuery 元素选择器和属性选择器同意通过标签名、属性名或内容对 HTML 元素进行选择。...在 HTML DOM 术语中：选择器同意对 DOM 元素组或单个 DOM 节点进行操作。 jQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元素。...jQuery CSS 选择器 jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。...以下的样例把全部 p 元素的背景颜色更改为红色： $("p").css("background-color","red"); 上面的看完了我也不知道选择器是什么。。。...如：(“ul li:first”)、(“div#intro .head”)）选取当前 HTML 元素：$(this) 嵌套选择器如：选取指定标签中的其他标签中的元素：$(标签名 *) （注意指定的标签中一定要有其他标签

2K1 0

fullPage.js全屏滚动插件

如果你要制作一个全屏的网页，使用这个插件在合适不过，如QQ浏览器官方网站直接下载使用方法 1.引入fullpage.css文件 css" href="css/jquery.fullPage.css"> 2.引入jq 和 fullpage.js文件 <script src="https://cdn.jsdelivr.net/npm...,//显示导航 navigationPosition:'right', //导航显示右边 controlArrowColor:'red',//左右滑块背景颜色...}); 4.参数设置传递对象形式参数说明 resize (true/false)字体是否随着窗口缩放而缩放 slidesColor 设置背景颜色 anchors (array)定义锚链接...左右滑块的箭头的背景颜色 loopBottom (true/false)滚动到最底部后是否滚回顶部 loopTop (true/false)滚动到最顶部后是否滚底部 loopHorizontal (true

18.6K2 0

Bootstrap快速入门

这儿值得的一说的就是fonts中通过字体文件代替了过去的.png，其通过@font-face语法，将安全的Web字体实时下载到客户端，便于任意缩放、改变颜色。 Html标准模板如下所示 css选择器上id数量的总和，一般为1个；c是用在该css选择器上的其他属性css选择器和伪类的总和，包括class（.btn）和属性css选择器li[id=red];d计算元素div和伪元素...，也就是改变左右浮动，并设置浮动的距离，其通过.col-md-push-*和.col-md-pull-*实现。...常用js插件在之前CSS的基础上，BootStrap自带12种jQuery插件，其利用bootstrap数据API，大部分插件可以在不编写任何代码的情况下触发。...，如Alert.prototype.close 在jQuery上定义插件并重设插件构造函数，如$.fn.alert.Constructor=Alert 防冲突处理，如$.fn.alert.noConflict

5.2K6 1

JQuery基础学习

介绍和概述 JQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。...> JQuery对象和JS对象转换 JQuery对象在操作时，更加方便。...如果元素对象上不存在class="one"，则添加。 css()：直接设置css样式 css()设置id为one背景颜色为绿色" id="b6"/> $("#b6...()获得id为one背景颜色" id="b5"/> css()设置id为one背景颜色为绿色" id="b6"/>

4.1K2 0

脚本语言知识总结.

黄色 ² 设置表格偶数行背景色绿色 ² 设置页面中所有标题显示为灰色 ² 设置页面中正在执行动画效果div背景黄色，不执行动画div背景绿色 css("color","blue"); // 设置表格奇数行背景色黄色 /设置表格偶数行背景色绿色 $("tr:even").css("background-color","yellow...字体颜色为红色 ² 表格奇数行背景色黄色 ² 表格偶数行背景色灰色 ² 只有一个td的 tr元素字体为蓝色颜色为红色 $("#mytable tr:nth-child(3n)").css("color","red"); // 表格奇数行背景色黄色 / 表格偶数行背景色灰色 $("table.../jquery-1.8.3.min.js"> $(function(){ // 点击button，使一个div的背景颜色变为

6.6K13 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭