iT邦幫忙

2023 iThome 鐵人賽

DAY 3
0

昨天認識網頁標頭的寫法,那今天說明網頁主體的寫法與內容:

1.body是網頁所呈現的內容
屬性有 background="url":背景圖片
bgcolor="color" 或#aaccaa:背景顏色
text ="color" 或#aaccaa:文字顏色
link ="color" 或#aaccaa:超連結顏色
vlink="color"或#aaccaa:造訪過超連結的顏色

2.h1到h6標籤:
h1到h6 數字越小,呈現的字體越大。
h1在第一段,h2在第二段,依此類推。

->align="left"代表向左對齊
->align="center"代表置中對齊
->align="right"代表向右對齊

要設定標題顏色用font color ="red"(圖一),也可以用CSS來設定。(圖二)

(圖一程式碼)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036fa856qhlx3.png
(圖一)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036cUGVhiUhou.png

(圖二程式碼)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036ZnMMrfAm1T.png
(圖二)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036cUGVhiUhou.png

3.p標籤:
段落的意思
範例如下(圖三)

(圖三程式碼)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036LtBfIWHc1j.png
(圖三呈現結果)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036jrQUftlcXz.png

4.結構標籤介紹nav:
nav 表示導覽列
<li><a href ="超連結">匿名的朋友</a></li>(圖四)
按下匿名的朋友後,會直接連結到歌的頁面。
(圖四程式碼)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036M6lu2QAkGV.png
(圖四呈現結果)
https://ithelp.ithome.com.tw/upload/images/20230918/20163036xAsZ29Re53.png

5.header與 footer標籤:
header:通常放網站標題、超連結、導覽列。
footer:在網頁的頁尾,通常放聯絡方式。


上一篇
Day2網頁標頭
下一篇
Day4區塊格式、文字格式、項目清單
系列文
學習網頁前端基本的技術,包含如何使用HTML標籤跟CSS做出基本的網頁版型,了解bootstrap template如何建置網頁架構。30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言