JavaScript

超轻量级php框架startmvc

jquery设置css样式的多种方法(总结)

更新时间:2020-04-24 17:40:01 作者:startmvc
设置css样式的多种方法总结,jquery<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8

设置css样式的多种方法总结,jquery


<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <style>
 </style> 
</head>
<body>
 <ul>
 <li>兄弟多个1</li>
 <li>兄弟多个2</li>
 <li>兄弟多个3</li>
 <li>兄弟多个4</li>
 <li>兄弟多个5</li>
 <li>兄弟多个6</li>
 <li>兄弟多个7</li>
 <li>兄弟多个8</li>
 <li>兄弟多个9</li>
 </ul>
 <ul id="ul">
 <li>兄弟多个1</li>
 <li>兄弟多个2</li>
 <li>兄弟多个3</li>
 <li>兄弟多个4</li>
 <li>兄弟多个5</li>
 <li>兄弟多个6</li>
 <li>兄弟多个7</li>
 <li>兄弟多个8</li>
 <li>兄弟多个9</li>
 </ul>

 <script type="text/javascript" src="jquery-1.11.1.js"></script>
 <script>
 //设置css属性
 $("ul").css("backgroundColor","red"); 

 //同时设置多值
 $("ul").css({
 backgroundColor: "yellow",
 fontSize: "16px"

 });

 //间隔显示不一样的颜色
 $("#ul li").css("color",function(index,value){
 console.log(index); //当前元素的序号
 console.log(value); //当前元素要设置的样式的值
 if(index%2==0){
 return "red";
 }else{
 return "blue";
 }
 });

 </script>
</body>
</html> 

以上这篇jquery设置css样式的多种方法(总结)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

jquery设置css样式