iT邦幫忙

html教學相關文章
共有 134 則文章
鐵人賽 Modern Web DAY 16
跟著 OXXO 一起學 HTML 系列 第 40

技術 ( Day 16.2 ) HTML 標示聯絡方式 <address>

&lt;address&gt; 標示聯絡方式元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字變成斜體字,並在標籤語意上強調是「聯絡方式」,這篇教學會...

鐵人賽 Modern Web DAY 16
跟著 OXXO 一起學 HTML 系列 第 39

技術 ( Day 16.1 ) HTML 標示注音 <ruby>、<rt> 和 <rp>

如果在 HTML 裡想要「替中文字加上注音」,可以使用 &lt;ruby&gt; 和 &lt;rt&gt; 顯示中文字注音 ( 或拼音 ) 的功能,,這篇教學會...

鐵人賽 Modern Web DAY 5
打造你的第一個網站 系列 第 5

技術 第五天-HTML標籤實作分享

在前面幾天,我們介紹了很多的標籤,今天我們將介紹最後一個常用標籤,並且在最後面的地方提供連結下載分享我的github實例,給大家參考。 12.form:表單,表...

鐵人賽 Modern Web DAY 15
跟著 OXXO 一起學 HTML 系列 第 38

技術 ( Day 15.4 ) HTML 收折文字內容 <details>、<summary>

&lt;details&gt; 收折文字內容元素可以將一段文字內容收折隱藏,收折後會出現一個三角形圖示,點擊三角形圖示可以將文字展開,使用時常搭配 &lt;su...

鐵人賽 Modern Web DAY 15
跟著 OXXO 一起學 HTML 系列 第 37

技術 ( Day 15.3 ) HTML 程式碼內容 <code>

&lt;code&gt; 程式碼內容元素會使用「monospace 等寬字體」,在 HTML 裡進行程式碼的顯示,這篇教學會介紹 &lt;code&gt; 程式...

鐵人賽 Modern Web DAY 15
跟著 OXXO 一起學 HTML 系列 第 36

技術 ( Day 15.2 ) HTML 預先格式化 <pre>

&lt;pre&gt; 預先格式化元素 ( preformatted text ) 可以保留原始文字內容格式,不論是空白或換行都會被保留,加上預設等寬字的屬性,...

鐵人賽 Modern Web DAY 15
跟著 OXXO 一起學 HTML 系列 第 35

技術 ( Day 15.1 ) HTML 引用文字 <blockquote>、<q> 和 <cite>

如果 HTML 有引用別處的內容,通常會使用 &lt;blockquote&gt;、&lt;q&gt; 或 &lt;cite&gt; 來包覆這些內容,,這篇教學...

鐵人賽 Modern Web DAY 14
跟著 OXXO 一起學 HTML 系列 第 34

技術 ( Day 14.3 ) HTML 上標文字 <sup>、下標文字 <sub>

上標文字 &lt;sup&gt; 和下標文字 &lt;sub&gt; 元素,可以在不套用 CSS 樣式的狀態下,將 HTML 的文字套用上標與下標格式效果,這篇...

鐵人賽 Modern Web DAY 14
跟著 OXXO 一起學 HTML 系列 第 33

技術 ( Day 14.2 ) HTML 小型文字 <small>

&lt;small&gt; 小型文字元素,可以在不套用 CSS 樣式的狀態下,將 HTML 的文字套用較小尺寸的樣式效果,這篇教學會介紹小型文字元素。 原文參...

鐵人賽 Modern Web DAY 14
跟著 OXXO 一起學 HTML 系列 第 32

技術 ( Day 14.1 ) HTML 凸顯文字 <mark>

&lt;mark&gt; 凸顯文字元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字加上黃底,進行凸顯的效果,這篇教學會介紹 &lt;mark&gt;...

鐵人賽 Modern Web DAY 3
打造你的第一個網站 系列 第 3

技術 第三天 更多的標籤

為了美化我們HTML的網頁,HTML提供幾種常用的模板語言,以下我們一一介紹, 1.h1-h6:標題標籤(Head Line),h後面的數字代表著文字的大小,1...

鐵人賽 Modern Web DAY 13
跟著 OXXO 一起學 HTML 系列 第 31

技術 ( Day 13.4 ) HTML 插入 ( 底線 ) 文字 <ins>

&lt;ins&gt; 插入 ( 底線 ) 文字元素可以在不套用 CSS 樣式的狀態下,將 HTML 的文字加上底線,標示該文字為「插入」的用途 ( inser...

鐵人賽 Modern Web DAY 13
跟著 OXXO 一起學 HTML 系列 第 30

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

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

鐵人賽 Modern Web DAY 13
跟著 OXXO 一起學 HTML 系列 第 29

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

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

鐵人賽 Modern Web DAY 13
跟著 OXXO 一起學 HTML 系列 第 28

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

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

鐵人賽 Modern Web DAY 12
跟著 OXXO 一起學 HTML 系列 第 27

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

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

鐵人賽 Modern Web DAY 12
跟著 OXXO 一起學 HTML 系列 第 26

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

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

鐵人賽 Modern Web DAY 12
跟著 OXXO 一起學 HTML 系列 第 25

技術 ( Day 12.1 ) HTML 換行 <br>

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

鐵人賽 Modern Web DAY 11
跟著 OXXO 一起學 HTML 系列 第 24

技術 ( Day 11.2 ) HTML 圖片 <img>

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

鐵人賽 Modern Web DAY 11
跟著 OXXO 一起學 HTML 系列 第 23

技術 ( Day 11.1 ) HTML 超連結 <a>

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

鐵人賽 Modern Web DAY 10
跟著 OXXO 一起學 HTML 系列 第 22

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

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

鐵人賽 Modern Web DAY 10
跟著 OXXO 一起學 HTML 系列 第 21

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

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

鐵人賽 Modern Web DAY 10
跟著 OXXO 一起學 HTML 系列 第 20

技術 ( Day 10.2 ) HTML 段落 <p>

雖然在 HTML 的裡直接輸入文字,文字也會正常顯示,但通常會使用 &lt;p&gt; 包覆需要分段的文字內容,如此一來不僅能讓 HTML 的架構更為明確,調整...

鐵人賽 Modern Web DAY 10
跟著 OXXO 一起學 HTML 系列 第 19

技術 ( Day 10.1 ) HTML 標題 <h1>~<h6>

在 HTML 的內容裡,會使用 &lt;h1&gt;~&lt;h6&gt; 的標籤代表標題元素 ( heading ),在不需要設定任何樣式的狀態下,文字會自動...

鐵人賽 Modern Web DAY 9
跟著 OXXO 一起學 HTML 系列 第 18

技術 ( Day 9.4 ) HTML 重設根目錄 <base>

&lt;base&gt; 是 HTML 裡「重設根目錄」的元素,該元素並不會在頁面裡顯示,主要作用可以設定「相對路徑的根目錄」,這篇教學會介紹 &lt;base...

鐵人賽 Modern Web DAY 9
跟著 OXXO 一起學 HTML 系列 第 17

技術 ( Day 9.3 ) HTML 載入外部資源 <link>

&lt;link&gt; 是 HTML 裡負責「載入外部資源」的元素,該元素不會在頁面裡顯示,通常作為標記 favicon 圖示與載入 CSS 檔案使用,這篇教...

鐵人賽 Modern Web DAY 9
跟著 OXXO 一起學 HTML 系列 第 16

技術 ( Day 9.2 ) HTML 網頁資訊 <meta>

&lt;meta&gt; 是 HTML 裡標記「網頁資訊」的元素,該元素不會顯示在頁面中,主要目的是將這份網頁的資訊,提供給瀏覽器、社群網站或搜尋引擎使用,這篇...

鐵人賽 Modern Web DAY 9
跟著 OXXO 一起學 HTML 系列 第 15

技術 ( Day 9.1 ) HTML 網頁標題 <title>

&lt;title&gt; 是 HTML 裡標記「網頁標題」的元素,該元素並不會在頁面裡顯示,反而會顯示在瀏覽器的頁籤,或是儲存為「我的最愛」或「書籤」時的名稱...

鐵人賽 Modern Web DAY 8
跟著 OXXO 一起學 HTML 系列 第 14

技術 ( Day 8.2 ) HTML 套用 JavaScript

如果說 HTML 負責建構網頁的骨架、CSS 負責網頁的外觀,JavaScript 就是負責網頁的「動作程式」,這篇教學將會介紹 HTML 裡三種套用 Java...

鐵人賽 Modern Web DAY 8
跟著 OXXO 一起學 HTML 系列 第 13

技術 ( Day 8.1 ) HTML 套用 CSS 樣式

如果說 HTML 負責建構網頁的骨架,CSS 就是負責處理網頁的外觀,這篇教學將會介紹 HTML 裡三種套用 CSS 的方法。 原文參考:HTML 套用 CS...