iT邦幫忙

鐵人檔案

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

跟我一起學習HTML&CSS網頁設計吧 系列

想做網站還在猶豫如何下手嗎?
透過HTML及CSS就可以實現你的願望了!
接下來30天會介紹入門至網站架設的相關文章,透過簡單的學習,也可以成為網頁設計者的一份子喔~
有興趣的話,就跟著文章一起學習

參賽天數 9 天 | 共 30 篇文章 | 5 人訂閱 訂閱系列文 RSS系列文
DAY 1

[DAY_1]文章前言&簡單介紹HTML&CSS

前言 第一次參與ithome鐵人賽,目前就讀相關資訊科系,以前就知道這項比賽了,連續30天發佈主題技術文章,覺得很有趣也非常有挑戰,但因為畏懼自己的能力是否足夠...

2022-09-15 ‧ 由 Rina 分享
DAY 2

[DAY_2]VScode 優點與下載教程

為何是VScode? 選它的原因: 要寫好一個程式,或者想要好好寫程式,那不可或缺的就是一個好用的文字編輯器。 這次推薦大家下載的程式為「visual stud...

2022-09-16 ‧ 由 Rina 分享
DAY 3

[DAY_3]HTML基本結構

在了解它的常用標籤前,我們先來談談HTML的基本結構吧。了解他的表示方式,能讓我們更容易好好地運用,開始囉~ 結構 一開始接觸的人應該覺得HTML很複雜,很...

2022-09-17 ‧ 由 Rina 分享
DAY 4

[DAY_4]粗談CSS介紹篇

CSS是網頁製作的一大利器,他可以調整HTML把版面變得更好看。如果失去了CSS的輔助,網頁其實就會辦得很單薄,透過CSS我們就可以輕易改變網頁外觀,讓整體活潑...

2022-09-18 ‧ 由 Rina 分享
DAY 5

[DAY_5]文字編輯的基本功

學習到HTML、CSS的架構後,我們來認識基本的常用標籤。 首先,請你先創建一個資料夾(名稱可以自定義),接下來我們需要使用VScode開啟它 開啟後,會有以...

2022-09-19 ‧ 由 Rina 分享
DAY 6

[DAY_6]圖片、影片、音檔的加入

網頁怎麼可以少了圖片呀生活照、美食照、個人照、寵物照、甚至是作品......都可以讓使用者(網頁參觀者)更了解我們要談論的主題,如果有影片或音檔,那肯定會更有趣...

2022-09-20 ‧ 由 Rina 分享
DAY 7

[DAY_7]不可缺少的超連結、網頁跳轉

今天除了網址超連結,還會介紹文字的超連結、圖片點入的超連結;讓網站中的元素可以直接跳轉到外部網站,在對於介紹某餐廳、訂位網站、顯示參考資料......都可以派上...

2022-09-21 ‧ 由 Rina 分享
DAY 8

[DAY_8]表格建立(上)-基本運用

今天要教大家如何在網頁上建立表格,因為稍微小複雜,所一拆開成基本與進階教學兩階段。 認識表格 表格標籤組成 製作表格是由欄與列組成,從3個標籤建立而來: t...

2022-09-22 ‧ 由 Rina 分享
DAY 9

[DAY_9]表格建立(下)-進階調整、框線與美化

學習完上篇表格的基礎建立,這篇會分享如何在基礎的表格上,添加一些變化方式。 表格在網站上的位置 在table標籤中使用align屬性,參數值為left(表格靠...

2022-09-23 ‧ 由 Rina 分享
DAY 9

[DAY_10]清單,呈現一目了然

大家好呀,我們已經來到第十天的教學了,前面都有學起來嗎?今天要來談論的是「清單」製作。 甚麼是清單 清單在HTML語法中,類似於列點清單的樣式,就像大家都熟知...

2022-09-25 ‧ 由 Rina 分享