Try   HackMD

HTML 1. - meta tag 補充:

  • 撰寫於 head to head 之間的網頁資訊
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="robots" content="index, follow" /> 
    // 主要是提升該網頁在 google 被查找的機會
    <meta name="description" content="基本的網頁描述，與介紹" />
    // 用於描述該網頁
    <meta name="author" content="wilson chen" />
    //描述該網頁的開發者是誰
    <title>Document</title>
  </head>

  • meta = "description" content=""
    該標籤屬性的內容輸入之後，會顯示在什麼地方呢?
    可參考: google 輸入 "amazon" 在瀏覽下方圖片:

    搜尋選單下列的小型字體就是該 content 的描述內容
    不過這些資訊通常不會直接顯示在網頁，需要透過: 右鍵去搜尋網頁原始碼才看得到

更多 head elements tag 工作參考書

切記，head 只是描述網頁資訊，而非像是 body 表現出樣式

tags: 2022 網頁開發全攻略教程
Last changed by 
 
Wilson Chen
0
99

Read more

CSS 34. Opacity / 透明度設定與簡介

&#x4F7F;&#x76EE;&#x6A19;&#x5143;&#x7D20;&#x900F;&#x660E;&#x5EA6;&#x6539;&#x8B8A; opacity &#x53EF;&#x8A2D;&#x5B9A;&#x7BC4;&#x570D;: 0 ~ 1.0 // 0 &#x70BA;&#x5B8C;&#x5168;&#x900F;&#x660E;&#x3002; <h1>&#x6A19;&#x984C;&#x6E2C;&#x8A66;</h1> h1 { display: inline-block; background: red; }

Dec 10, 2022
CSS 33. table styling / 表格樣式設計

border-collapse: &#x5047;&#x8A2D;&#x6211;&#x6709;&#x500B;&#x8868;&#x683C;&#x9577;&#x9019;&#x6A23;: <table> <tr> <th>&#x6A19;&#x984C;&#x4E00;</th> <th>&#x6A19;&#x984C;&#x4E8C;</th> <th>&#x6A19;&#x984C;&#x4E09;</th> </tr>

Dec 10, 2022
CSS 32. List Styling / ul,ol Tag

&#x5728; CSS &#x88FD;&#x4F5C;&#x6642;&#xFF0C;&#x53EF;&#x4EE5;&#x88AB;&#x7DE8;&#x8F2F;&#x7684;&#x9805;&#x76EE;&#x6A23;&#x5F0F;: &#x4EE5;&#x6B64; HTML ul &#x505A;&#x7BC4;&#x4F8B;: <ul> <li>2008:&#x5718;&#x5718;&#x5713;&#x5713;&#x5230;&#x53F0;&#x7063;</li> <li>2013:&#x5713;&#x4ED4;&#x51FA;&#x751F;</li> <li>&#x9084;&#x6C92;&#x6709;&#x5176;&#x4ED6;&#x718A;&#x8C93;</li> </ul>

Dec 10, 2022
CSS 31. CSS default value

&#x4EC0;&#x9EBC;&#x662F; default value &#x6307; HTML Tag &#x672C;&#x8EAB;&#x5177;&#x5099;&#x7684; CSS &#x6548;&#x679C;: <h1>&#xFF0C;&#x672C;&#x8EAB;&#x7684;&#x6587;&#x5B57;&#x5927;&#x5C0F;&#x5C31;&#x6BD4;&#x8F03;&#x5927;&#xFF0C;font-size &#x5C31;&#x975E;&#x5E38;&#x660E;&#x986F;&#x3002; <div>&#xFF0C;&#x672C;&#x8EAB;&#x5177;&#x5099; - display:block;&#x7B49;&#x3002; &#x900F;&#x904E; box-model &#x700F;&#x89BD;&#x4E26;&#x4E14;&#x89C0;&#x5BDF; Tag &#x672C;&#x8EAB;&#x7684; default styling

Dec 10, 2022
Read more from Wilson Chen
Published on HackMD