Jquery使用css方法改变样式实例
本文实例讲述了Jquery使用css方法改变样式。分享给大家供大家参考。具体实现方法如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>Jquerycss方法</title>
<styletype="text/css">
div{width:100px;margin:0pxauto;border:1pxsolidred;}
</style>
<scriptsrc="jquery-1.6.2.min.js"type="text/javascript"></script>
<scripttype="text/javascript">
$(function(){
$("#btnChangeCss").click(function(){
var$divs=$("div");//返回JQuery对象,包含两个div元素
//----举例1
//alert("Div的Border样式:"+$divs.css("border-color"));
//读取css样式
//----举例2
//$divs.css("backgroundColor","#ccff66");
//设置两个div元素的背景颜色
//----举例3链式设置三个个css属性
$divs.css("width","500px").css("background-color","#ffff00").css("font-size","88px");
});
});
</script>
</head>
<body>
<inputid="btnChangeCss"type="button"value="改变样式"/>
<divid="div1">我是div1</div>
<divid="div2">我是div2</div>
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。