首頁 > 文章 > web前端 > html div怎麼設定大小

html div怎麼設定大小

青灯夜游原創: 2021-10-11 13:51:5421529瀏覽

html div設定大小的方法：在div標籤中，使用style屬性設定「width:寬度數值單位 ;」和「height: 高度數值單位;」樣式即可。

html div怎麼設定大小

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

在HTML中，

可定義文件中的分隔區塊或區域部分。

標籤可以把文件分割成獨立的、不同的部分。它可以用作嚴格的組織工具，並且不使用任何格式與其關聯。

<!doctype html>
<html>
 <head>
  <meta charset="UTF-8">
  <style type="text/css">
  div{
  border: 1px solid red;
  }
  </style>
 </head>
 <body>
<div>测试文本</div>
<div>测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本</div>
 </body>
</html>

html div怎麼設定大小

可以看出div標籤的寬度是預設滿屏的，而高度就預設是內容高度。

但我們可以透過手動為div設定樣式來改變它的大小：

只需要在div標籤中，使用style屬性設定「width:寬度數值單位;」和「height:高度數值單位;”樣式即可。

<!doctype html>
<html>
 <head>
  <meta charset="UTF-8">
  <style type="text/css">
  div{
  border: 1px solid red;
  }
  </style>
 </head>
 <body>
<div style="width:200px ;">测试文本</div>
<div style="width:700px ;height: 100px;">测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本测试文本</div>
 </body>
</html>

效果圖：

html div怎麼設定大小

推薦教學：《html影片教學》

以上是html div怎麼設定大小的詳細內容。更多資訊請關注PHP中文網其他相關文章！

html5 css3 html

陳述：

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

上一篇：html怎麼去掉input邊框下一篇：html怎麼去掉input邊框

看更多