iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
佛心分享-IT 人自學之術

新手踏入網頁前端的世界 系列

此系列主要是透過閱讀《HTML5、 CSS3 、Bootstrap5 、JQuery 網頁前端學習手冊》這本書後,想和大家分享我的學習心得與筆記,順帶一提,這本書裡面的內容是彩色印刷、範例導向,因此對於初學者十分友善也更容易閱讀。

鐵人鍊成 | 共 30 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day1 前言

哈囉大家好~這個系列將帶領零基礎的新手進入網頁前端的世界 學習動機隨著大學課程的推進,讓我對於自己所缺乏的相關知識感到好奇,因此我想透過閱讀這本《HTML5...

2024-09-05 ‧ 由 zhiz 分享
DAY 2

Day2 網頁基本結構

語法基本結構大致如下: <!DOCTYPE html> <html> <head> </head> <b...

2024-09-06 ‧ 由 zhiz 分享
DAY 3

Day 3 實作範例 &網頁區塊結構

實作範例 為了讓昨天學習到的知識更加熟悉,今天將透過實作一個簡單的範例來加深印象。程式碼如下: <!DOCTYPE html> <html l...

2024-09-07 ‧ 由 zhiz 分享
DAY 4

Day4 資料編輯與格式化 (上) &實作範例

今天要介紹區塊格式 這些標籤能讓網頁畫面編排上更加美觀,也能讓瀏覽者閱讀起來直觀些。以下將搭配實作範例讓知識更清晰!! <pre>標籤 由於HTML...

2024-09-08 ‧ 由 zhiz 分享
DAY 5

Day5 資料編輯與格式化 (下)

今天要介紹的是文字格式 <br>標籤 功用是換行,其特別的地方是沒有結束標籤。 <p> 標籤 功用是另起段落,行距較<br>標籤大...

2024-09-09 ‧ 由 zhiz 分享
DAY 6

Day6 URL&超連結

首先介紹的是網址URL (Universal Resource Location) 其格式大致如下:通訊協定://伺服器名稱/資料夾/文件名稱 通訊協定如:h...

2024-09-10 ‧ 由 zhiz 分享
DAY 7

Day7 圖片標籤

今天要介紹如何透過標籤來調整圖片的高度、寬度、框線 <img>標籤 功用是將圖檔插入網頁中。以下介紹其屬性: src 代表圖片的來源,是sourc...

2024-09-11 ‧ 由 zhiz 分享
DAY 8

Day8表格標籤與格式

今天要學習的是表格標籤 功用是讓網頁呈現的文字表格化,使瀏覽者更容易讀取或比較資訊。 <table>標籤 標籤內寫入表格的結構和內容。 <tr...

2024-09-12 ‧ 由 zhiz 分享
DAY 9

Day9 實作範例 &顏色RGB

實作範例 為了讓昨天學習到的知識更加熟悉,今天將透過實作這個範例來加深印象。 <!DOCTYPE html> <html lang=&quot...

2024-09-13 ‧ 由 zhiz 分享
DAY 10

Day10 影音格式與標籤

首先是HTML5支援的影音檔案格式 以下將介紹7種常用的格式: MPEG副檔名為.mpg或.mpeg AVI副檔名為.avi WMV副檔名為.wmv Quic...

2024-09-14 ‧ 由 zhiz 分享