div標籤小知識

2021-09-20 18:51:38 字數 516 閱讀 1301

在進行web前端開發時經常用到div這個標籤,乙個div標籤的面積被均分為12列,類似下圖:

因此我們在設計介面的時候就可以根據這個來設計版面,具體用法為:在div標籤中使用class=「col-sm-x」(其中x為具體數值)來設定。x的取值為1~12,具體數值佔面積比如下:

col-sm-12 

.col-sm-11

.col-sm-10

.col-sm-9

.col-sm-8

.col-sm-7

.col-sm-6

.col-sm-5

.col-sm-4

.col-sm-3

.col-sm-2

.col-sm-1

另外:可以在div中使用style="width:~px"屬性設定div模組的寬度。

HTML標籤之div標籤

div標籤的重要作用 1 劃分區域,使 更具有邏輯性 2 可結合css針對該區域進行樣式控制 看乙個沒有使用div標籤的示例,如下 doctype html html head title 這是頁面標題 title meta name keywords content 自學h5 h3 靜夜思 h3 ...

div標籤的設定

div基本設定 width 寬height 高background 背景background color 背景色 英文單詞 十六進製制 rgb 背景圖background image url 路徑 背景圖平鋪 background repeat no repeat repeat x repeat y...

div標籤消除浮動

1 第乙個div 第二個div 1 的截圖為,可以看到,id2和id3並沒有在id1中。這就是沒有清除浮動的效果。清除浮動的方法 1 對父級設定合適的高度 對父級設定合適的高度進行清除浮動,父級內內容的高度為20px 2px 22px,在id1中增加樣式height 22px 即可。效果圖 缺點 對...