html創建盒子


創建盒子在編輯html代碼中非常重要

1.創建盒子

(1)先在body中創建div

(2)在 head中寫入style

 

 

(3)在style中寫入盒子的邊框寬度、線條形式、顏色

 

 

 

 (4)打開網頁查看效果

(5)盒子創建完成

上面創建的盒子 只有一個盒子 沒有寬度 沒有高度

下面來編輯盒子

2、編輯盒子

(1)添加盒子寬度

 

 打開頁面查看效果

 

 剛才沒編輯寬度的時候 寬度是頁面的100% 現在編輯后 明顯看到已經有了寬度

(2)添加盒子高度

 

 打開頁面查看效果

 

 這樣既可以看到盒子既有寬度 又有高度

3.調整盒子外部線條樣式

盒子線條有三個元素 按順序分別是 寬度、樣式、顏色

(1)更改寬度

在border后三個元素第一個元素更改 

 

 

 

 

 

 

由上部代碼及效果 可以看出像素值越大 邊框線條越寬

(2)編輯線條樣式

 

 

 

 solid為實線

 

 

 double為雙實線

 

 

 

 dotted為點虛線

 

dashed為線段虛線

(3)更改線條顏色

通過更改border第三個元素 更換顏色

 

 

 

 

 

 4、多個盒子進行編輯

在body中創建多個div 然后進行命名

 (1)命名

創建三個不同的盒子 為三個不同的盒子分別取名字

(分別取名字,是為了分開編輯,若三個盒子一樣相同效果,可不用取名字,直接創建盒子即可)

 

 (2)分別編輯

在head中分別編輯

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM