# 🏅 Day 1 - HTML 語意標籤運用 歡迎各位參加本次的切版直播班,每日作業主要是將各個知識點作拆分,透過每日練習與補充這些知識點,每日花數分鐘便能與直播課程本身達到良好的協同作用,十分建議同學們能盡量完成,若有任何問題也歡迎在 Discord 做詢問喔~ ## HTML 語意標籤運用 語意標籤可以增加可讀性,透過閱讀標籤就了解該區塊的意思,幫助搜尋引擎以及瀏覽器的顯示跟搜尋。 ### 基本 HTML 標籤介紹 **h1 ~ h6** 一個網頁一定會有一個 h1 標籤,用來標示網頁中最重要的資訊。其餘 h2 ~ h6 依照重要性依序使用。 **img** 圖片使用 img 標籤,圖片位址放在標籤內 src 屬性中。 將 alt 屬性內補上描述,當圖片失效時可以呈現出文字,讓使用者可以了解原本圖片的意義。 **a** 連結使用 a 標籤,網址連結放在標籤內 href 屬性中。 當目前沒有要連至特定網頁時可以設定為 `<a href="#"> ... </a>` **p** 一個段落、一句話 .. 都可以使用, 讓文字具有語意。 **ul li、ol li** ul、ol 的子層只能是 li。 條列式項目、清單、選單、產品陳列等等都可以使用 ul li 列表結構, 若是該列表有順序則可以使用 ol li 結構。 ### 題目 請複製此 [Codepen](https://codepen.io/hexschool/pen/OJQGKPY?editors=1000) ,修正 HTML 標籤運用。 ## 回報流程 將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 解答位置請參考下圖(需打開程式碼的部分觀看) (也可以將答案直接貼至「回報區」) ![](https://i.imgur.com/vftL5i0.png) <!-- 解答:https://codepen.io/hexschool/pen/jOZRgLM --> <!-- Ray 文章:https://israynotarray.com/html/20230613/61882704/ --> 回報區 --- | # | Discord | CodePen / 答案 | |:---:|:---------------:|:--------------------------------------------------------------------------------:| | 1 | 兔子 | [Codepen](https://codepen.io/ttppoo12144/pen/dyEeqgv?editors=1000) | | 2 | ya_meow | [Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/pomVOYm?editors=1000) | | 3 | 爆漿 | [codepen](https://codepen.io/dhpsxzwh-the-decoder/pen/qBGYMgq) | | 4 | han | [Codepen](https://codepen.io/iamHanCheng/pen/rNgvZRa?editors=1000) | | 5 | fan-fan | [Codepen](https://codepen.io/fan1102/pen/Jjqvaqb?editors=1000) | | 6 | chloe_墨 | [Codepen](https://codepen.io/ChloeTseng1026/pen/GRadYWX) | | 7 | Jainee | [Codepen](https://codepen.io/Jainee0110/pen/abrGRaL) | | 8 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/abrGQOG) | | 9 | Theodore | [Codepen](https://codepen.io/GustavoFringgg/pen/BaexGMp?editors=1000) | | 10 | peggy | [Codepen](https://codepen.io/peggy0419/pen/bGyMZrw) | | 11 | Kaya | [Codepen](https://codepen.io/kayaribi/pen/yLWjwwK) | | 12 | OSN | [Codepen](https://codepen.io/osncodepen/pen/abrGMxM?editors=1000) | | 13 | macihuang | [Codepen](https://codepen.io/macy1215/pen/JjqvVbj) | | 14 | Dory | [Codepen](https://codepen.io/dorihung/pen/dyEeLqN) | | 15 | 1457 | [Codepen](https://codepen.io/1457dys/pen/YzbLMBQ) | | 16 | 小翎 | [Codepen](https://codepen.io/debbielin/pen/LYomvKx?editors=1000) | | 17 | Anna | [Codepen](https://codepen.io/Anna-Teng/pen/PovevJX?editors=1010) | | 18 | CrystalLala | [Codepen](https://codepen.io/crystallala/pen/bGyMPNd) | | 19 | Jim | [Codepen](https://codepen.io/JimChou/pen/LYomKzq?editors=1000) | | 20 | Kai | [Codepen](https://codepen.io/beginneraboutlife116/pen/yLWjmLE?editors=1000) | | 21 | kawa | [Codepen](https://codepen.io/z83xji6/pen/NWVMQaM?editors=1000) | | 22 | NocabWang(培根) | [Codepen](https://codepen.io/PeihanWang/pen/zYQjbZj?editors=1000) | | 23 | lunlun0514 | [Codepen](https://codepen.io/f5badapple/pen/YzbvKWY?editors=1000) | | 24 | anderson666 | [Codepen](https://codepen.io/goodmanbuild/pen/oNRyvgW) | | 25 | zxlee | [Codepen](https://codepen.io/zxlee/pen/rNgKBzL?editors=1000) | | 26 | emmayo | [Codepen](https://codepen.io/emmayo/pen/LYorPgd) | | 27 | erichsu0406 | [Codepen](https://codepen.io/esxwvufg-the-flexboxer/pen/rNgKBQy) | | 28 | Kim | [Codepen](https://codepen.io/kim0101__/pen/gOJzJPj?editors=1100) | | 29 | jasonlin | [Codepen](https://codepen.io/gfswkraq-the-reactor/pen/pomKzYb) | | 30 | Neoyo | [Codepen](https://codepen.io/Neo-oo/pen/MWdXgNJ) | | 31 | N7 | [Codepen](https://codepen.io/neohyntw/pen/BaeVarz) | | 32 | wind | [Codepen](https://codepen.io/wind7y/pen/OJYEJzM) | | 33 | 周周 | [Codepen](https://codepen.io/jhoujhou-the-decoder/pen/JjqZoGg?editors=1000) | | 34 | Arvin | [Codepen](https://codepen.io/arvinyang1925/pen/dyEKPNG?editors=1010) | | 35 | Ivy | [Codepen](https://codepen.io/Irene-Ke/pen/YzbvPNW?editors=1000) | | 36 | lianne._. | [Codepen](https://codepen.io/Elaina-L/pen/yLWEyzQ) | | 37 | david1819 | [Codepen](https://codepen.io/David-Lin-the-vuer/pen/BaeVyRw) | | 38 | icesea25 | [Codepen](https://codepen.io/icesea25/pen/vYwrEVm) | | 39 | Mike | [Codepen](https://codepen.io/mike2049/pen/eYaKmwY?editors=1000) | | 40 | wan_ju | [Codepen](https://codepen.io/hexschool/pen/OJQGKPY) | | 41 | Sonia | [Codepen](https://codepen.io/YUJOU/pen/mdYKJZo?editors=100) | | 42 | Yolanda | [Codepen](https://codepen.io/vcscqrtz-the-animator/pen/wvbXKKB) | | 43 | Tung | [Codepen](https://codepen.io/ru-ching/pen/Yzbvyxb) | | 44 | 超立方體Andy | [Codepen](https://codepen.io/Andy-Yu-the-scripter/pen/LYorpLM) | | 45 | wei | [Codepen](https://codepen.io/Wei-the-sasster/pen/KKLedEy?editors=1000) | | 46 | Lobinda | [Codepen](https://codepen.io/Lobinda/pen/ZENRbBJ?editors=1100) | | 47 | gracechiang225 | [CodePen](https://codepen.io/gracechiang225/pen/WNByrMy) | | 48 | Noelle | [CodePen](https://codepen.io/NoelleKH/pen/jOoKyvw?editors=1000) | | 49 | 阿蘇 | [CodePen](https://codepen.io/kukvzqps-the-solid/pen/NWVzjGe) | | 50 | n913239 | [Codepen](https://codepen.io/n913239/pen/ZENRKXb?editors=1000) | | 51 | 皮皮 | [Codepen](https://codepen.io/rainbow-the-reactor/pen/dyEKWwe?editors=1000) | | 52 | 萴 | [Codepen](https://codepen.io/SZL741023/pen/YzbvQzR?editors=1000) | | 53 | 深海 | [Codepen](https://codepen.io/KAI-SHIN-the-animator/pen/dyEKRwB) | | 54 | ray | [CodePen ](https://codepen.io/KAI-SHIN-the-animator/pen/dyEKRwB) | | 55 | Kerwin | [Codepen](https://codepen.io/kerwin/pen/jOoKLNa) | | 56 | Ten | [Codepen](https://codepen.io/HHH_Ten/pen/OJYEjGv?editors=1000) | | 57 | GAVI | [Codepen](https://codepen.io/qbafldcv-the-scripter/pen/QWRxqEo) | | 58 | Ariel | [Codepen](https://codepen.io/ariel0510/pen/bGyKawr?editors=1000) | | 59 | 嚼勁 | [Codepen](https://codepen.io/James520284/pen/YzbvvJL) | | 60 | KUN. | [Codepen](https://codepen.io/barry91205/pen/RwmJBJX?editors=1000) | | 61 | Heidi | [Codepen](https://codepen.io/Heidi-Hsiao/pen/JjqZwXq?editors=1000) | | 62 | 泊岸 | [Codepen](https://codepen.io/qoq77416416/pen/GRaBKXX?editors=1000) | | 63 | hao jing | [Codepen](https://codepen.io/hjxu/pen/vYwrwbr?editors=1000) | | 64 | 小草尼 | [Codepen](https://codepen.io/niiiiiiiiiima/pen/LYoBRQY?editors=1000) | | 65 | Tony名彤 | [Codepen](https://codepen.io/Ming-Tung-Chien/full/oNRMZxr) | | 66 | robinhuang0855 | [Codepen](https://codepen.io/Robin-Huang-the-typescripter/pen/QWRBvOo) | | 67 | 地瓜 | [Codepen](https://codepen.io/huangtzuchin/pen/rNgrmvO?editors=1000) | | 68 | KevinHuang | [Codepen](https://codepen.io/qw-huang/pen/gOJjRxJ?editors=1000) | | 69 | Hsiu8767 | [Codepen](https://codepen.io/hsiu8767/pen/PovBezN) | | 70 | jinliu214 | [Codepen](https://codepen.io/jinliu214/pen/zYQMKJW?editors=1000) | | 71 | Angela_la | [Codepen](https://codepen.io/Angela-the-builder/pen/PovxGjM?editors=1100) | | 72 | Sammy | [Codepen](https://codepen.io/fsczdlla-the-bold/pen/yLWQbGR?editors=1000) | | 73 | qet1717 | [Codepen](https://codepen.io/gwteqexi-the-bold/pen/VwOVMNj ) | | 74 | 咖 | [Codepen](https://codepen.io/daru-Ga/pen/RwmqxpE ) | | 74 | jimmy.0706 | [Codepen](https://codepen.io/JimmyMao/pen/zYQabOz ) | | 75 | OZ | [Codepen](https://codepen.io/OZ_design/pen/dyEwNYM?editors=1100 ) | | 76 | Po Wei | [Codepen](https://codepen.io/Po-Wei-Lai/pen/bGyOaYX?editors=1000 ) | | 77 | Glen_69515 | [Codepen](https://codepen.io/glenyaochih/pen/OJYBELR) | | 78 | Joanne hu | [Codepen](https://codepen.io/nelbabkv-the-flexboxer/pen/abrPYxZ) | | 78 | yamaki0601 | [Codepen](https://codepen.io/yamaki8061/pen/BaevVOp) | | 79 | yamaki0601 | [Codepen](https://codepen.io/fbnpemqq-the-vuer/pen/eYabjKq?editors=1100) | | 80 | Amy(咂摳) | [Codepen](https://codepen.io/nnxucgmc-the-builder/pen/wvbRxxX?editors=1000) | | 81 | VVN | [Codepen](https://codepen.io/fbnpemqq-the-vuer/pen/eYabjKq) | | 82 | chuang | [Codepen](https://codepen.io/uidoytjq-the-solid/pen/GRaPPOw?editors=1000) | | 83 | smallr1229 | [Codepen](https://codepen.io/Smallr/pen/QWRPQeE) | | 84 | brucelee0629 | [Codepen](https://codepen.io/xxhdklwi-the-decoder/pen/MWdRVQQ?editors=1000) | | 85 | JIAWUN | [Codepen](https://codepen.io/wkasixgv-the-sasster/pen/eYaoLgo) | | 86 | bubble | [Codepen](https://codepen.io/mmdkausk-the-reactor/pen/VwONqLe) | | 87 | 蘑菇星星 | [Codepen](https://codepen.io/brrrieon-the-vuer/pen/VwOOZxd) | | 88 | Darius_TszYing | [Codepen](https://codepen.io/bekgnohe-the-selector/pen/abrrbGQ) | | 89 | skyderry | [Codepen](https://codepen.io/hvvjvkva-the-sasster/pen/NWVVWab) | | 90 | 白夜 | [Codepen](https://codepen.io/Wei903/pen/XWwwdwg?editors=1000) | | 91 | 咖咖 | [Codepen](https://codepen.io/chia-yu-chung/pen/pommNBy?editors=1000) | | 92 | 星雨 | [Codepen](https://codepen.io/ybxyuhcv-the-solid/pen/WNBBoLN?editors=1000) | | 93 | Ana | [Codepen](https://codepen.io/Ana-Wu/pen/MWdXWmE) | | 94 | MY | [Codepen](https://codepen.io/ahmomoz/pen/WNBBpeZ) | | 95 | hi264277 | [Codepen](https://codepen.io/hexschool/pen/OJQGKPY?editors=1000) | | 96 | xcx100 | [Codepen](https://codepen.io/c13026/pen/gOJJmxW) | | 97 | hi264277 | [Codepen](https://codepen.io/ygfaoycv-the-solid/pen/rNgoEWR) | | 98 | jerry_66983 | [Codepen](https://codepen.io/Barry-C/pen/ZENNrpY?editors=1000) | | 99 | 俊 | [Codepen](https://codepen.io/jun12079/pen/mdYYOwK) | | 100 | Annis | [Codepen](https://codepen.io/Annis-shen/pen/dyEEdWV?editors=1000) | | 101 | Eason | [Codepen](https://codepen.io/eulvmmbq-the-typescripter/pen/ZENNxQK?editors=1000) | | 102 | jeffjoe486 | [Codepen](https://codepen.io/Jeff-K-the-selector/pen/wvbbmPM) | | 103 | sinyi | [Codepen](https://codepen.io/sinyiii/pen/xxNNMGV) | | 104 | anson tsai | [Codepen](https://codepen.io/vuogajlx-the-vuer/pen/QWRXpGq?editors=1000) | | 105 | Hailey | [Codepen](https://codepen.io/sxbokfja-the-flexboxer/pen/mdYZWqE)| | 106 | jamesct34 | [Codepen](https://codepen.io/JCT34/pen/wvbLrBm)| | 107 | sam_huang | [Codepen](https://codepen.io/jcjpcegf-the-styleful/pen/abrgqEZ) | 108 | 小咪 | [Codepen](https://codepen.io/iloveu3000x/pen/yLWdjav) | 109 | 黑嚕嚕 | [Codepen](https://codepen.io/wzokvjha-the-vuer/pen/rNgEvPR) | 110 | BonBonC | [Codepen](https://codepen.io/abon-chen/pen/vYwqvdN) | | 111 | 陳小廷 | [Codepen](https://codepen.io/ting1124/pen/BaegvrR?editors=1010) | | 112 | Ann | [Codepen](https://codepen.io/ygmkwjdb-the-encoder/pen/BaegvPZ) | | 113 | 邵 | [Codepen](https://codepen.io/ukscrlno-the-typescripter/pen/JjqQxXY?editors=1010)| | 114 | Tippy | [Codepen](https://codepen.io/Ektodor-Wang/pen/gOJNqXe)| | 115 | yoishere | [Codepen](https://codepen.io/zrdiegwx-the-selector/pen/Yzboomb)| | 116 | Kiwi | [Codepen](https://codepen.io/kiwi1113/pen/dyEBxKP)| | 117 | iamcan | [Codepen](https://codepen.io/uhnxswdq-the-typescripter/pen/VwOoZYj)| | 118 | Enn | [Codepen](https://codepen.io/enntang/pen/gOJVYrG)| | 119 | EdHuang | [Codepen](https://codepen.io/yide1986/pen/XWwvrXv)| | 120 | Davidchi | [Codepen](https://codepen.io/DAVID-CHI/pen/OJYKJqP)| | 121 | EmmaMa | [Codepen](https://codepen.io/Emma0919/pen/Yzbmwwo)| | 122 | 柯柯 | [Codepen](https://codepen.io/ko13/pen/WNBVwPm?editors=1010)| | 123 | Ollie D | [Codepen](https://codepen.io/daiyy97/pen/ZENgOrL?editors=1000)| | 124 | jeellyfiiish6455 | [Codepen](https://codepen.io/SylviaChuang/pen/GRaVEjY)| | 125 | ji3di | [Codepen](https://codepen.io/jwuuhtxh-the-builder/pen/RwmXZwz?editors=1000)| | 126 | dgajc | [Codepen](https://codepen.io/dgajc/pen/abreyZa?editors=1000)| | 127 | allan90119 | [Codepen](https://codepen.io/fljbjhui-the-solid/pen/bGyXoKx) | | 128 | fendy1223 | [Codepen](https://codepen.io/fendy1223/pen/YzbmvWG?editors=1000) | | 129 | hoyiiiii | [Codepen](https://codepen.io/hoyii/pen/oNRKyyY?editors=1000) | | 130 | xiaoban6033 | [Codepen](https://codepen.io/NatashaLin/pen/rNgXrLL?editors=1000) | | 131 | Chewsday | [Codepen](https://codepen.io/Chewsday/pen/BaeXMxr?editors=1000)| | 132 | .sytiny | [Codepen](https://codepen.io/emma6542/pen/xxNvdWV)| | 133 | Evelyn | [Codepen](https://codepen.io/wvqofopk-the-builder/pen/KKLOLXG)| | 134 | 安安兒 | [Codepen](https://codepen.io/joanne-wei/pen/LYowKEy?editors=1000)| | 135 | Enzo | [Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/pomVOYm?editors=1000)| | 136 | Avis | [Codepen](https://codepen.io/hexschool/pen/OJQGKPY?editors=1000)| | 136 | eziya | [Codepen](https://codepen.io/Vveziyamimi/pen/ExBYKGj)| | 137 | Si | [Codepen](https://codepen.io/Si-/pen/poXzRJX)| | 138 | phoebeee427 | [Codepen](https://codepen.io/zvndazxy-the-vuer/pen/vYqBgWj)| | 139 | noellia |[Codepen](https://codepen.io/hexschool/pen/OJQGKPY?editors=1000) | 140| Matt BB |[Codepen](https://codepen.io/mm3248965/pen/mdYKVaB) | 141 | 610 |[Codepen](https://codepen.io/YI-LING-LIU/pen/wvLweEb?editors=1000) | 142 | ㄚ華 |[Codepen](https://codepen.io/rzzuehiv-the-vuer/pen/OJeLOMw?editors=1000) | 143 | Charlotte Wong |[Codepen](https://codepen.io/Charlotte-Wang/pen/mdZbXVE) | 144 | Yunya |[Codepen](https://codepen.io/cookie1515/pen/bGPbLyj?editors=1000) | 145 | Jia |[Codepen](https://codepen.io/Jianna9527/pen/WNqeMjM) | 146 | 魚肉 |[Codepen](https://codepen.io/qnbegtco-the-looper/pen/MWMgXdd?editors=1000) | 147 |Show21|[Codepen](https://codepen.io/t10026706/pen/MWMgLJq?editors=1000) | 148 |shine_lalala|[Codepen](https://codepen.io/cdjpjets-the-solid/pen/ExBYrvz) | 149 |Steven1220|[Codepen](https://codepen.io/Steven1220/pen/XWwvYGm) | 150 |xuannnnn|[Codepen](https://codepen.io/its_xuanxuan/pen/eYwOoBR?editors=1000) | 151 |wang|[Codepen](https://codepen.io/mrha9145/pen/GRbKLRz) | 152 |喵喵|[Codepen](https://codepen.io/snow1224/pen/poXovae) | 152 |馬丁|[Codepen](https://codepen.io/wyipzpnh-the-decoder/pen/VwJwLPY?editors=1000) | 153 |slowyu|[Codepen](https://codepen.io/YuS-LIN/pen/mdZdPqr) | 154 |圈圈|[Codepen](https://codepen.io/weiwei137/pen/yLdLYMm) | 155 |LKP|[Codepen](https://codepen.io/qtghjujs-the-sasster/pen/jOjOYxM) | 156 |eddiesun0526|[Codepen](https://codepen.io/Eddie0526/pen/XWLWYVo?editors=1000) | 155 |maosin|[Codepen](https://codepen.io/xzdmyfsx-the-vuer/pen/vYqEVmo) | 157| Seljuk| [Codepen](https://codepen.io/Seljuk0727/pen/bGPNOEZ) | 158| xiang5141| [Codepen](https://codepen.io/XIANG-XIANG/pen/abgOOER) | 159| leo.chang| [Codepen](https://codepen.io/s16777216/pen/VwJLmgZ)