iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Modern Web

跟著 OXXO 一起學 HTML 系列

吳柏毅 ( Uber Eats ) 什麼都點得到,就是點不到 HTML,對吧!?
由於 HTML 這麼簡單,大家都不太想分享,既然如此那我就來分享一下吧,透過鐵人賽分享 HTML 的相關知識,相信對於要入門網頁的朋友來說,一定非常實用喔!

----
大家好,我是 OXXO.STUDIO,我在 2021 年成立了 STEAM 教育學習網,在網站裡,我已經撰寫超過 1000 篇以上的教學文章,也包含了快 100 篇的 HTML 教學,這次會從我撰寫的文章中挑選相關內容分享,希望大家會喜歡。

鐵人鍊成 | 共 90 篇文章 | 9 人訂閱 訂閱系列文 RSS系列文
DAY 10

( Day 10.3 ) HTML 行內容器 <span>

HTML 的文字除了可以使用段落元素 &lt;p&gt; 來表示,也可以使用「行內容器」來處理,通常使用 &lt;span&gt; 元素會搭配 &lt;div&...

2023-09-10 ‧ 由 oxxo 分享
DAY 10

( Day 10.4 ) HTML 區塊容器 <div>

HTML 裡的 &lt;div&gt; 是十分常見的「區塊容器」,只要任何需要排版的位置,可能都會透過 &lt;div&gt; 搭配 CSS 或 JavaScr...

2023-09-10 ‧ 由 oxxo 分享
DAY 11

( Day 11.1 ) HTML 超連結 <a>

如果在要在 HTML 裡設計可以外連其他網頁的功能,就必須使用 &lt;a&gt; 來建立「超連結」,當使用者點擊超連結之後,就能前往指定的網頁,或是進行發送...

2023-09-11 ‧ 由 oxxo 分享
DAY 11

( Day 11.2 ) HTML 圖片 <img>

使用 &lt;img&gt; 是 HTML 裡的圖片元素,使用時只要在 src 屬性裡填入圖片的網址,或是圖片的 base64 編碼,就可以在網頁中顯示圖片,這...

2023-09-11 ‧ 由 oxxo 分享
DAY 12

( Day 12.1 ) HTML 換行 <br>

撰寫 HTML 內容時,並不能像撰寫 word 或 txt 檔案一樣,單純透過「enter」將內容「換行」,HTML 必須依靠 &lt;br&gt; 進行換行,...

2023-09-12 ‧ 由 oxxo 分享
DAY 12

( Day 12.2 ) HTML 水平分隔線 <hr>

在 HTML 裡使用 &lt;hr&gt; 後,會在畫面中放入一條「水平分隔線」,透過水平分隔線來進行不同段落的區隔,這篇教學會介紹如何使用 &lt;hr&gt...

2023-09-12 ‧ 由 oxxo 分享
DAY 12

( Day 12.3 ) HTML 內嵌頁框 <iframe>

&lt;iframe&gt; 是 HTML 的內嵌頁框元素,可以在一個網頁中內嵌另外一個網頁,像是在網頁裡放入 Youtube 影片、Facebook 貼文區塊...

2023-09-12 ‧ 由 oxxo 分享
DAY 13

( Day 13.1 ) HTML 粗體字 <strong>、<b>

&lt;strong&gt; 和 &lt;b&gt; 粗體字元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字加粗顯示,這篇教學會介紹 &lt;str...

2023-09-13 ‧ 由 oxxo 分享
DAY 13

( Day 13.2 ) HTML 斜體字 <em>、<i>

&lt;em&gt; 和 &lt;i&gt; 斜體字元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字變成斜體字,這篇教學會介紹 &lt;em&gt;...

2023-09-13 ‧ 由 oxxo 分享
DAY 13

( Day 13.3 ) HTML 刪除線文字 <del>

&lt;del&gt; 粗體字元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字加上刪除線,這篇教學會介紹 &lt;del&gt; 刪除線文字元素。...

2023-09-13 ‧ 由 oxxo 分享