當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

016_css()方法

發布時間：2025/4/17 编程问答 45 豆豆

生活随笔收集整理的這篇文章主要介紹了 016_css()方法小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

1. css()方法返回或設置匹配的元素的一個或多個樣式屬性。

2. 返回CSS屬性值

2.1. 返回第一個匹配元素的CSS屬性值。

2.2. 注釋: 當用于返回一個值時, 不支持簡寫的CSS屬性(比如: "background"和"border")。

2.3. 語法

$(selector).css(name)

2.4. 參數

3. 設置CSS屬性

3.1. 設置所有匹配元素的指定CSS屬性。

3.2. 語法

$(selector).css(name,value)

3.3. 參數

4. 設置多個CSS屬性

4.1. 把"名/值對"對象設置為所有匹配元素的樣式屬性。這是一種在所有匹配的元素上設置大量樣式屬性的最佳方式。

4.2. 語法

$(selector).css({property:value, property:value, ...})

4.3. 參數

5. 使用函數來設置CSS屬性

5.1. 此函數返回要設置的屬性值。接受兩個參數, index為元素在對象集合中的索引位置, value是原先的屬性值。

5.2. 語法

$(selector).css(name,function(index,value))

5.3. 參數

6. 例子

6.1. 代碼

<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>css()方法</title><script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(document).ready(function(){$('#btn1').click(function(){$("#p1").css('background', 'red');});$('#btn2').click(function(){$("p").css({'width': '400px', 'height': '100px'});});$('#btn3').click(function(){$("#p2").css('background', function(index, value){return 'green';});});$('#btn4').click(function(){$("p").css('height', '');});$('#btn5').click(function(){alert($("p").css('background-color'));});$('#btn6').click(function(){alert($("p").css('background'));});});</script></head><body><p id="p1">css()方法返回或設置匹配的元素的一個或多個樣式屬性。</p><p id="p2">css()方法返回第一個匹配元素的CSS屬性值。</p><button id="btn1">設置CSS屬性</button> <button id="btn2">設置多個CSS屬性</button> <button id="btn3">使用函數來設置CSS屬性</button><br /><br /> <button id="btn4">清空height屬性值</button> <button id="btn5">返回background-color屬性值</button> <button id="btn6">返回background屬性值</button> </body> </html>

6.2. 運行效果圖

6.3. 點擊設置CSS屬性按鈕

6.4. 點擊設置多個CSS屬性按鈕

6.5. 點擊使用函數來設置CSS屬性按鈕

6.6. 點擊清空height屬性值按鈕

6.7. 點擊返回background-color屬性值按鈕

6.8. 點擊返回background屬性值按鈕

總結

以上是生活随笔為你收集整理的016_css()方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

方法
_CSS