iT邦幫忙

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

技術 ( Day 23.1 ) HTML 頁首區塊 <header>

&lt;header&gt; 是進入 HTML5 之後才加入的頁首區塊元素,通常會放在頁面或某些區塊的上方作為「頁首」使用,這篇文章將會介紹 &lt;heade...

鐵人賽 Modern Web DAY 7

技術 #06補充 網頁的根、絕對路徑、相對路徑,那些關於路徑的小知識

HTML 的屬性 href、src 都需要指定檔案路徑才能載入進來,所以這邊補充個關於路徑的小知識。 何謂網頁的根(root)? 指的是網域底下第一層的檔案...

鐵人賽 Modern Web DAY 7

技術 #06 寫一份簡單的 HTML,常用 HTML Tag 總整理

↓ 今日學習重點 ↓ 練習使用 HTML 的各種標籤(tag) 知道 CSS 和 JS 要放在 HTML 的哪裡? 今天,讓我們來了解一份簡單...

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

技術 ( Day 22.3 ) HTML 表單元素分組 <fieldset>

&lt;fieldset&gt; 是 HTML 表單裡的分組元素,可以將表單裡同類型或同樣意義的元素進行分組,這篇文章將會介紹欄位資料清單元素的用法。 原文參...

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

技術 ( Day 22.2 ) HTML 欄位資料清單 <datalist>

&lt;datalist&gt; 是 HTML 表單裡的欄位資料清單元素,通常是輔助 &lt;input&gt; 元素使用,讓使用者除了可以輸入內容,也可以使用...

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

技術 ( Day 22.1 ) HTML 欄位標題 <label>

&lt;label&gt; 是 HTML 表單裡的欄位標題元素,通常是作為 &lt;button&gt;、&lt;checkbox&gt; 或 &lt;radi...

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

技術 ( Day 21.3 ) HTML 進度條 <progress>

&lt;progress&gt; 是 HTML 裡的進度條元素,不只可以在表單中顯示進度,更常常作為「載入中」的等待畫面使用,這篇文章將會介紹 &lt;prog...

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

技術 ( Day 21.2 ) HTML 下拉選單 <select>、<option>、<optgroup>

&lt;select&gt;、&lt;option&gt; 和 &lt;optgroup&gt; 是 HTML 表單裡的下拉選單元素,&lt;select&gt...

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

技術 ( Day 21.1 ) HTML 按鈕 <button>

&lt;button&gt; 是 HTML 表單裡的按鈕元素,通常會放在表單裡面讓使用者點擊,這篇文章將會介紹 &lt;button&gt; 表單按鈕元素的用法...

鐵人賽 Modern Web DAY 6

技術 #05 HTML 基礎語法

↓ 今日學習重點 ↓ 了解 HTML 的語法 上一篇文章,我們有建立了一份 HTML 檔案, 那麼這些語法到底是什麼意思呢?讓我們往下看。 HTML...

鐵人賽 影片教學 DAY 5

技術 一起來實作響應式網頁設計:HTML的表單元素 Day5

影片教學 重點回顧 平常瀏覽網頁一定會常碰到需要填寫表單的時候,可能是需要註冊某個網站以獲取該網站提供的服務,或是報名活動填寫個人資料,又或者是購買東西需填寫...

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

技術 ( Day 20.3 ) HTML 行文字輸入 <textarea>

&lt;textarea&gt; 是 HTML 表單裡的可以讓使用者輸入多行文字的元素,這個元素常出現在許多的留言板或文字編輯器裡,這篇文章將會介紹 &lt;t...

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

技術 ( Day 20.2 ) HTML 輸入 <input>

&lt;input&gt; 輸入元素是 HTML 表單元件裡最重要也最特別的元素,&lt;input&gt; 可以根據類型 type 屬性的設定,轉換成不同的輸...

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

技術 ( Day 20.1 ) HTML 表單 <form>

&lt;form&gt; 表單元素是 HTML 裡讓使用者輸入資料,並且讓這些資料傳遞到後端伺服器的元素,雖然隨著 JavaScript 框架的興起,很多功能都...

鐵人賽 影片教學 DAY 4

技術 一起來實作響應式網頁設計:HTML新增的結構元素 Day4

影片教學 重點回顧 撰寫HTML時,將相關的元素包裝在一起,有助於網頁的結構性,過去式採用div來作為一個區塊,但過多的div可能會造成混淆,因此,透過HTM...

鐵人賽 Modern Web DAY 4

技術 【Day04】前端撰寫(1)HTML基本架構

在上一天篇的貼文中,想必你各位都已經把環境給設置好了吧。是不是迫不期待想開發一個屬於你的網頁了呢?別急,就讓我們開始吧! 首先,想要學習網頁,必須要先認識 HT...

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

技術 ( Day 19.4 ) HTML 表格元素 <colgroup>、<col>

&lt;colgroup&gt; 和 &lt;col&gt; 是 HTML 裡非必須的表格元素 ( 通常不會特別去使用 ),使用後能對表格中的垂直縱列做分組,方...

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

技術 ( Day 19.3 ) HTML 表格元素 <thead>、<tbody>、<tfoot>

&lt;thead&gt;、&lt;tbody&gt; 和 &lt;tfoot&gt; 是 HTML 裡非必須的表格元素 ( 通常不會特別去使用 ),使用後能讓...

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

技術 ( Day 19.2 ) HTML 表格元素 <th>、<caption>

&lt;caption&gt; 是 HTML 表格裡負責顯示「表格的標題」元素,&lt;th&gt; 則是負責顯示「某一欄或某一列的標題」元素,這篇教學會介紹...

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

技術 ( Day 19.1 ) HTML 表格 <table>、<tr>、<td>

如果要在 HTML 裡放入表格,最基本是使用 &lt;table&gt;、&lt;tr&gt; 和 &lt;td&gt; 來製作表格,這篇教學會介紹如何在 HT...

鐵人賽 影片教學 DAY 3

技術 一起來實作響應式網頁設計:HTML的常用元素 Day3

影片教學 重點回顧 今天的內容主要是展示一些常用的元素elements &lt;hr&gt; &lt;!--就是水平線--&gt; &lt;pre&gt;...

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

技術 ( Day 18.3 ) HTML 無序清單 <ul>、<li>

&lt;ul&gt; 和 &lt;li&gt; 是 HTML 裡的無序清單元素,使用後會產生清單列表,並使用預設樣式 ( 或指定樣式 ) 產生清單符號,這篇文章...

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

技術 ( Day 18.2 ) HTML 自訂清單 <dl>、<dt>、<dd>

&lt;dl&gt;、&lt;dt&gt; 和 &lt;dd&gt; 是 HTML 裡的自訂清單元素,使用後會產生自訂的清單列表,這篇文章會介紹 &lt;dl&...

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

技術 ( Day 18.1 ) HTML 有序清單 <ol>、<li>

&lt;ol&gt; 和 &lt;li&gt; 是 HTML 裡的有序清單元素,使用後會產生清單列表,並預設使用數字或字母 ( 可指定開頭數字或字母 ) 作為清...

鐵人賽 影片教學 DAY 2

技術 一起來實作響應式網頁設計:一探HTML世界 Day2

影片教學 教學重點回顧 HTML全名為HyperText Markup Language,HyperText表示非一般純文字,而是能藉由文字導向到其他網頁。而...

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

技術 ( Day 17.3 ) HTML 標示可換行位置 <wbr>

當 HTML 裡出現一段很長的英文單字時,往往會根據畫面寬度來進行換行 ( 超過寬度就換行 ),而 &lt;wbr&gt; 標示可換行位置元素可以提示「換行的時...

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

技術 ( Day 17.2 ) HTML 標示縮寫 <abbr>

&lt;abbr&gt; 標示縮寫元素在標籤語意上表示「縮寫」,可以告訴搜尋引擎這是縮寫字,就這篇教學會介紹 &lt;abbr&gt; 標示縮寫元素。 原文參...

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

技術 ( Day 17.1 ) HTML 標示時間日期 <time>

&lt;time&gt; 標示時間日期元素在標籤語意上表示「時間日期」,如果搜尋引擎如果要抓取時間日期,就會優先從這個標籤著手讀取,這篇教學會介紹 &lt;ti...

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

技術 ( Day 16.3 ) HTML 標示鍵盤按鍵 <kbd>

&lt;kbd&gt; 標示鍵盤按鍵元素在標籤語意上表示「鍵盤輸入按鍵」,或表示其他輸入的指令 ( 例如語音輸入 ),可以在不套用 CSS 樣式的狀態下,將 H...

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

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

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