iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
Modern Web

Web前端的探索:30天的驚奇之旅 系列

《Web前端的探索: 30天的驚奇之旅》內容涵蓋了HTML、CSS、JavaScript的基礎知識,通過實踐操作和創意挑戰,在探索過程中不斷學習和成長。

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

Day1.如何安裝環境?

首先,先安裝好vscode 接者打開vscode,安裝這幾個延伸模組,有利於後續程式的撰寫Live Server能夠快速地開啟瀏覽器,瀏覽自己寫的網頁,也能即時...

2024-09-09 ‧ 由 yuyu_1111 分享
DAY 2

Day2.網頁架構基本介紹

在前一篇有提到html的預設內容,那我們要如何從預設內容去寫入我們要的程式呢?以下程式碼中,有分別寫入css、html、javascript的位置,這非常重要!...

2024-09-10 ‧ 由 yuyu_1111 分享
DAY 3

Day3.如何連結css檔和js檔

在前一篇有提到html的格式,如圖 <!DOCTYPE html> <html lang="en"> <hea...

2024-09-11 ‧ 由 yuyu_1111 分享
DAY 4

Day4.基礎表格<tr><td>

table通常用在表格上,他會結合&lt;tr&gt; &lt;td&gt;,顯示表格中的資料,我們也可以把&lt;tr&gt; &lt;td&gt;理解成tr...

2024-09-12 ‧ 由 yuyu_1111 分享
DAY 5

Day5.基礎表格<tr><th>

在前一篇有提到使用tr td做表格,但其實td也能用th作替代,接下來我們就來解釋一下th吧~th其實就是代表他是這一格的標題,也具有預設的粗體字和置中的樣式,...

2024-09-13 ‧ 由 yuyu_1111 分享
DAY 6

Day6.超連結<a>

當你需要按下此連結,就能跳到另一個指定網頁,那就需要用到&lt;a&gt;&lt;a&gt;主要是在html裡面建立超連結的元素,在&lt;a&gt;裡面也能搭...

2024-09-14 ‧ 由 yuyu_1111 分享
DAY 7

Day7.<h1>-<h6>標題元素

&lt;h1&gt;-&lt;h6&gt;分別代表六個不同級別的章節標題,&lt;h1&gt;為最高級別,&lt;h6&gt;為最低,接著,我們就直接透過實際的...

2024-09-15 ‧ 由 yuyu_1111 分享
DAY 8

Day8.<p>段落元素

&lt;p&gt;表示一個段落,&lt;p&gt;&lt;/p&gt;裡面的內容會自動分成一個段落 &lt;!DOCTYPE html&gt; &lt;html...

2024-09-16 ‧ 由 yuyu_1111 分享
DAY 9

Day9.<div>區塊容器元素

&lt;div&gt;主要是一個容器,他能夠包覆很多內容div本身並沒有任何特殊意義也不帶任何標籤語意在&lt;div&gt;上加id或class屬性,就能直接...

2024-09-17 ‧ 由 yuyu_1111 分享
DAY 10

Day10.<img>圖片

&lt;img&gt;標籤用在html文件中加入圖片&lt;img&gt;主要搭配src屬性來指定圖片位址src後面可以加上圖片網址或是在電腦中的圖片路徑 &l...

2024-09-18 ‧ 由 yuyu_1111 分享