在HTML中，我們經常會用到邊框來裝飾我們的頁面元素，但是如果我們直接給元素設置寬度后再設置邊框的話，會出現一個問題，就是邊框會讓元素的寬度增加，導致布局出現問題。為了解決這個問題，我們可以使用CSS中的“邊框左右自動”來實現。 一、什么是邊框左右自動？ 邊框左右自動是CSS中一個非常實用的屬性，它可以讓元素在有邊框的情況下保持寬度不變。也就是說，它能夠讓元素的寬度和內容的寬度一樣，讓邊框自動填充滿剩余的空間。這樣就能夠避免邊框撐開元素導致布局問題的出現。 二、如何使用邊框左右自動？ 要使用邊框左右自動，我們需要將元素的盒模型從默認的content-box改為border-box。這樣就可以讓邊框包含在盒子內部，從而不會影響元素的寬度。具體的代碼如下： pre{ box-sizing: border-box; } 在這個代碼中，我們使用了box-sizing屬性，并將其設置為border-box。這樣，包括padding和border在內的所有盒子尺寸都會計算在內。也就是說，我們不需要再為了讓邊框自動填充滿剩余的空間而費心了。 三、使用邊框左右自動的注意事項 在使用邊框左右自動的時候，需要注意以下幾點： 1. 建議用padding代替margin：邊框左右自動可以讓我們避免布局出現問題，但是如果我們用margin來設置元素的間距，就會出現兩個元素之間間距不準確的問題，所以建議使用padding代替margin。 2. 需要考慮IE瀏覽器的兼容：IE瀏覽器對box-sizing的支持不盡相同，有些版本可能會出現布局問題，需要我們手動去處理。 3. 調整盒子大小時注意邊框：當我們調整盒子大小時，需要注意邊框的大小，避免出現布局混亂的問題。 總之，邊框左右自動是CSS中一個非常實用的屬性，通過使用它，我們可以讓元素的寬度在有邊框的情況下保持不變，從而避免布局問題的出現。