鐵人檔案
為前一部「30 天轉生到 bootstrap 5 的意識界」的續集。
講述在現實世界昏迷一年後突然甦醒過來後，分享這一年以來在意識界中，所有發生和前端切版相關的故事。
此篇會介紹常用的兩種 logo 常用的技巧 background、img 標籤，以及講述為什麼不建議 h1>a>img 架構。 img im...
此篇會針對網站中能否「使用多個 h1？」這個問題來探討。 Q：再討論 h1 標籤之前，可以先聊聊為什麼需要標題標籤（heading tags）A：依照 重要...
Google 爬蟲透過解析網站架構，來理解網站的內容和重點，而對於好的「網站架構」來說，「網站可讀性」可是一大重點。 此篇不是要介紹如何提升 SEO，而是在探討...
此篇會透過實際的範例，來介紹一些新手剛開始使用標籤時，可能會遇到的狀況。 p 標籤 br 標籤 ul 標籤 h1~h6 標籤 p 標籤 <p&g...
此篇會介紹幾個新手在使用 inline 行內元素時常發生的問題。 開始前先來複習一下 行內元素 特性 不能修改寬高（寬高取決於內容本身） 擁有並排特性（不...
前一篇簡單介紹了行內元素特性（還不同的朋友可以先觀看前一篇），此篇會簡單演示兩種行內元素常見出現空白空隙的狀況以及如何解決。 下方空隙 inline 元素...
此篇會基於前兩篇介紹的行內元素常見誤區、關於行內元素的空白所介紹的特性和問題，來延伸介紹三個常見深受 inline 行內元素特性其害的標籤。 偽元素：偽元...
此篇主要為回答，前面這篇提到的「icon 使用 span 標籤父層 a 標籤高度比子層高」解法為什麼沒有 vertical-align: middle？ 因...
此篇不會討論 img 下方空隙如何解決以及怎麼產生的，有興趣可以看前面這篇文章。 這邊主要探討 img 解決下方空隙的方法，為什麼 vertical-alig...
此篇會主要會圍繞在 section 標籤、article 標籤兩者使用範例以及延伸的常見錯誤情境。 section 如何使用 section 與 div...
