首頁 >web前端 >css教學 >css如何設定div大小

css如何設定div大小

醉折花枝作酒筹
醉折花枝作酒筹原創
2021-04-20 16:59:135277瀏覽

在css中,可以使用width屬性和height屬性來設定div大小,只需要給div元素設定「width:值」和「height:值」樣式。 width屬性定義元素內容區的寬度,height屬性定義元素內容區的高度。

css如何設定div大小

本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。

新建一個html文件,命名為test.html,在test.html文件中,使用div標籤創建一個模組,並在div添加文字內容

在test.html文件中,設定div標籤的class屬性為erliu,主要用於下面透過該css設定div的css樣式。

在test.html檔案內,寫標籤,頁面的css樣式會寫在該標籤內。

在css標籤內,寫div的樣式,使用background屬性設定div的背景顏色為紅色。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>document</title> 
<style>
.erliu{
    background: red;
}
</style>
</head>
<body>
    <div class="erliu">
        测试
    </div>
</body>
</html>

查看:

css如何設定div大小

在css標籤內,編寫div的樣式,使用width屬性設定div的寬度為200px,使用height屬性設定div的高度為100px。

.erliu{
    /* width: 200px;
    height: 100px; */
    background: red;
}

查看效果:

css如何設定div大小

推薦學習:css影片教學

以上是css如何設定div大小的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn