如果您想讓您的網(wǎng)頁在打開時自動全屏,那么您可以使用CSS的fullscreen屬性來實現(xiàn)這個目的。
html, body { height: 100%; /*設(shè)置body和html元素的高度為100%*/ margin: 0; /*去掉body元素的邊距*/ padding: 0; /*去掉body元素的padding值*/ overflow: hidden; /*隱藏body元素的滾動條*/ } /*將目標(biāo)元素設(shè)置為全屏*/ .target-element { position: fixed; /*設(shè)置元素為fixed定位,固定在屏幕上*/ top: 0; right: 0; bottom: 0; left: 0; width: 100%; /*設(shè)置元素寬度為100%*/ height: 100%; /*設(shè)置元素高度為100%*/ z-index: 100; /*將元素的層級設(shè)置為最高*/ }
這段代碼將body和html元素的高度設(shè)置為100%,去除body元素的邊距和padding值,并隱藏body元素的滾動條。為了將目標(biāo)元素設(shè)置為全屏,我們將其定位為fixed,然后將其各邊距離屏幕頂部、右側(cè)、底部和左側(cè)都設(shè)置為0,將寬度和高度都設(shè)置為100%。最后,將層級設(shè)置為最高。
要將具體的元素設(shè)置為全屏,只需在其class中添加"target-element"即可。