今日進度

HTML5‧CSS3 最強圖解實戰講座的Lesson7

學習筆記

今日新知

• margin/padding簡寫
  • 1個個別:
    • margin-top:A;
      margin-right:A;
      margin-bottom:A;
      margin-left:A;
    • 簡寫:margin:A;
  • 2個個別:
    • margin-top:A;
      margin-right:B;
      margin-bottom:A;
      margin-left:B;
    • 簡寫:margin:A B;
  • 3個個別:
    • margin-top:A;
      margin-right:B;
      margin-bottom:C;
      margin-left:B;
    • 簡寫:margin:A B C;
  • 4個個別:
    • margin-top:A;
      margin-right:B;
      margin-bottom:C;
      margin-left:D;
    • 簡寫:margin:A B C D;
• border簡寫
  • 個別:
    • border-color:#FFD306;
      border-width:1px;
      border-style:solid;
    • 簡寫:border:#FFD306 1px solid;
• background簡寫
  • 個別:
    • background-color:#FFD306;
      background-image:url(圖片檔案路徑檔名.png);
      background-position:left top;
      background-repeat:repeat-x;
    • 簡寫:background:#FFD306 url(圖片檔案路徑檔名.png) left top repeat-x;

心得

搞懂簡寫的邏輯後，好像也沒很難XDD
一切都是自己想太多

初學者學習日誌，文章內容若有打錯歡迎直接糾正我，謝謝大家><