Yiru@Studio

 

• margin-top：與上方元素的距離
• margin-right：與右方元素的距離
• margin-bottom：與下方元素的距離
• margin-left：與左方元素的距離
• margin:auto;　//代表讓瀏覽器自己去設定。
• margin:0 auto;　//置中。
• margin:17px 15px 23px 13px;  //代表上外距為 17px，右外距為 15px，下外距為 23px 而左外距則為 13px (上、右、下、左)
• margin:20px;//四個邊同樣値

  

例:

<div class="container-fluid" style="background-color:yellow;margin-top:30px;">
  .....
</div>

 

---

• padding-top 文字與元素上方的邊界
• padding-right 文字與元素右方的邊界
• padding-bottom 文字與元素下方的邊界
• padding-left 文字與元素左方的邊界
• padding:20px;//四個邊同樣値

例:

<div style="background-color:yellow;padding-bottom:50px;">
 ...
</div>

4個值:
<span style= "padding:50px 30px 0 90px;">文字</span> /*設定邊界上  右  下  左*/
2個值:
<span style= "padding:50px 30px;">文字</span> /*設定邊界"上下"，"左右"*/
3個值:
<span style= "padding:50px 30px 90px;">文字</span> /*設定邊界"上"，"左右"，"下"*/
1個值:
<span style= "padding:50px;">文字</span> /*設定邊界"上下左右"值皆一樣*/

Yiru@Studio - 關於我 - 意如