CSS是網頁設計中重要的一部分,其中頁面居中是一個經常會遇到的設計問題。下面將介紹如何使用CSS來實現整個頁面的居中對齊。
這是標題
這是正文1
這是正文2
首先,在body標簽中設置了flex布局,通過justify-content和align-items可以分別控制頁面中子元素水平和垂直居中,同時height為100vh來使得頁面的高度為瀏覽器可視區域的高度。注意margin設置為0來去掉默認的邊距。
其次,給容器div設置了text-align:center來使得容器內的子元素水平居中,同時設置寬度為80%。h1和p標簽的字號和行高也做了相應的調整,從而使得頁面居中對齊更加美觀。
綜上所述,使用CSS的flex布局和統一的字號行高等方案可以很好地解決頁面整體居中的問題。