iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
自我挑戰組

網頁前端設計 系列

30天發文學習網頁前端設計,每天一步一步學,最後完成一個自己滿意的美美網站。

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

Day1-前言

大家好ヽ(´▽`)/我是剛升大三的學生,因為課程的關係,第一次參加iThome鐵人賽。 由於是個剛入門的小菜鳥,對於要選什麼題目來做困擾了我很久,希望找個對自己...

2022-09-01 ‧ 由 Alexia 分享
DAY 2

Day2-開發環境與網頁建構概述

今天我會介紹開發的環境與網頁建構的概述。 首先,選擇一個適合自己且順手好用的開發環境。而我用來寫程式碼的文字編輯器是Visual Studio Code,接著測...

2022-09-02 ‧ 由 Alexia 分享
DAY 3

Day3-HTML(一)

HTML是用來辨識網頁中的內容該如何被解讀,例如被解讀成一個段落、清單、文件標題、連結、圖片、多媒體撥放器、表格表單或是任何一個可使用的「元素」,甚至是自己定義...

2022-09-03 ‧ 由 Alexia 分享
DAY 4

Day4-HTML(二):基本元素

HTML由一系列的「元素」組成,利用它們來「標記」網頁中的每個部分,使它們呈現出你想要的樣子。 元素中主要的內容有: 起始標籤(opening tag):包含...

2022-09-04 ‧ 由 Alexia 分享
DAY 5

Day5-HTML(三):head標籤

上次介紹了按下「!」快捷鍵出現的基礎元素代表的意義,今天會介紹被包含在<head>標籤裡的元素種類,還會直接舉例實作,分享我覺得剛開始會比較常用到的...

2022-09-05 ‧ 由 Alexia 分享
DAY 6

Day6-HTML(四):body標籤

上次詳細介紹完了<head>標籤。今天,我們來介紹另一個重要的基本元素<body>標籤! 網頁上要呈現的內容基本都會放在這裡面,所以標籤...

2022-09-06 ‧ 由 Alexia 分享
DAY 7

Day7-HTML(五):段落標題與空白字元

這次會介紹<body>標籤裡,一個網路文章頁面最常用也是最基礎,用來設定顯示文字的標籤,也會有直接實作的部分~(๑•̀ㅂ•́)و✧ 在這之前,程式碼...

2022-09-07 ‧ 由 Alexia 分享
DAY 8

Day8-HTML(六):強調內容標籤與旁注標籤

今天要來介紹<body>標籤裡,用來強調、突顯一段文字內容特別重要的標籤,有特殊語意標籤與單純樣式效果標籤的差別,還有一般人或許不知道的特殊旁注標記...

2022-09-08 ‧ 由 Alexia 分享
DAY 9

Day9-HTML(七):水平分隔線與項目列表清單

上次介紹了小特殊標籤,今天來介紹水平分隔線和用來清楚列點的項目列表清單。那就直接開始吧~(๑•̀ㅂ•́)و✧ <hr> 水平分隔線 用來做為文字段落...

2022-09-09 ‧ 由 Alexia 分享
DAY 10

Day10-HTML(八):超連結

這次要來介紹超連結,透過點選藍字可以跳轉到另外一個頁面。那麼就開始吧~(๑•̀ㅂ•́)و✧ 瀏覽器通常會用不同的顏色、大小或樣式來顯示超連結,而且滑鼠游標移動到...

2022-09-10 ‧ 由 Alexia 分享