在網頁開發中,經常會遇到需要讓某個元素寬度自適應的情況。在這種情況下,我們可以使用 jQuery 來動態設置元素的 CSS 屬性。
$(document).ready(function() { // 獲取元素的父容器寬度 var parentWidth = $('#parent').width(); // 設置元素的寬度為父容器的寬度 $('#child').css('width', parentWidth); });
在上述代碼中,我們首先通過$('#parent').width()
獲取了元素的父容器寬度,然后使用$('#child').css('width', parentWidth)
將子元素的寬度設置為父容器的寬度。
需要注意的是,在實際開發中,我們可能需要使用到$(window).resize()
來監聽瀏覽器窗口大小的變化。這樣,在瀏覽器窗口大小發生變化時,我們可以及時更新元素的寬度。
$(window).resize(function() { var parentWidth = $('#parent').width(); $('#child').css('width', parentWidth); });
以上就是使用 jQuery 設置 CSS 寬度自適應的方法,希望對你有所幫助。