CSS是網頁設計中不可或缺的一個部分，它可以實現網頁中內容的樣式控制。在CSS中，div是一個常見的網頁元素，通常用于布局和盒模型的構造。
以下是一個CSS div網頁例題：
<!DOCTYPE html>
<html>
<head>
<title>CSS Div例題</title>
<style>
.container {
display: flex; /* 使用flex布局 */
justify-content: center; /* 垂直居中 */
align-items: center; /* 水平居中 */
height: 100vh; /* 高度占滿整個屏幕 */
}
.box {
width: 200px;
height: 200px;
background-color: #eee;
border: 2px solid #333;
border-radius: 5px;
text-align: center;
line-height: 200px;
font-size: 30px;
}
</style>
</head>
<body>
<div class="container">
<div class="box">Hello World</div>
</div>
</body>
</html>上面的代碼使用了CSS中的flex屬性，將.container元素設為flex布局，并使用justify-content和align-items屬性將其垂直和水平居中，這樣可以將.box元素放在頁面的正中央。同時，.box元素還設置了寬、高、邊框、圓角和文本樣式等，使其更加美觀和吸引人眼球。
這是一個簡單的CSS div網頁例題，通過這個例題，我們可以初步了解div元素在網頁設計中的應用，以及如何使用CSS控制元素的樣式和布局。如果您想深入學習CSS，可以閱讀一些相關的教程和書籍，逐步提高自己的CSS技能，為網站開發打下堅實的基礎。
上一篇css div距離上層