標題: Box Model 設計-內外邊距 [打印本頁]

---

作者: 陳育霖    時間: 2023-8-12 13:11     標題: Box Model 設計-內外邊距

本帖最後由 陳育霖 於 2023-8-29 01:09 編輯

Margin 外邊距設計

1. h1 {
   
2.   margin-top: 20px;
   
3.   margin-right: 30px;
   
4.   margin-left: 40px;
   
5.   margin-bottom: 50px;
   
6. }

複製代碼

margin: 上|右|下|左

1. h1{ margin: 20px 30px 40px 50px}

複製代碼

注意: 外邊距相遇時，會自動合併，取最大值的那個

Margin 內邊距設計

1. h1 {
   
2.   padding-top: 20px;
   
3.   padding-right: 30px;
   
4.   padding-left: 40px;
   
5.   padding-bottom: 50px;
   
6. }

複製代碼

padding: 上|右|下|左

1. h1{ padding: 20px 30px 40px 50px}

複製代碼

注意:
四個值：上、右、下、左
三個值：上、左右、下
兩個值：上下、左右
一個值：上下左右

---

歡迎光臨 種子論壇 | 高雄市資訊培育協會學員討論區 (http://seed.istak.org.tw/)

Powered by Discuz! 7.2