將樣式應用到body 元素的背景時,開發人員可能會遇到意想不到的現像是樣式超出了元素本身,影響了整個螢幕。這種行為源自於 body 元素與網站畫布關係的固有性質。
根據w3.org/TR/CSS21/colors.html 上的CSS 規範,根元素的背景屬性,是body 元素,「成為畫布的背景並覆蓋整個畫布。」因此,它充當整個網頁的背景,將自身錨定到根元素的位置。
實際上,當對 body 元素的背景進行樣式設定時,原始背景會消失,並會出現新的樣式套用於整個螢幕。無論應用於 body 元素本身的任何其他尺寸或樣式如何,都會發生這種情況。在提供的範例中,body 元素的邊框在 700px 寬度內保持可見,而背景顏色包含整個瀏覽器視窗。
因此,樣式在 body 元素本身之外的明顯擴展是以下結果body 元素作為根元素的角色及其與網頁畫布的交互。
以上是為什麼設定 Body 元素的背景樣式會影響整個螢幕?的詳細內容。更多資訊請關注PHP中文網其他相關文章!