第一篇
首先是emmet，VScode的插件，可以幫助我快速編寫html。
例如打!就可以把環境編寫好，或是.bgc可以跳出backgroudcolor等等...非常方便好用。
再來是SVG，以基本的圖案透過數學平面的各種操作來製圖，很有趣~回首頁的圖案就是以SVG製作的。
接下來table，是表格的資料型態，是個大單元。
一般以table標籤往下寫，會有caption寫標題，再來透過colgroup來控制每一列的樣式。
以上是thead的部分，再來tbody，表格的內容:以colspan以及rowspan來切格子，以&(+)nbsp;來表示空白格。
以th為標題，td為內容，可以用tr來當群組的標籤方便編寫與維護。
再來開始學CSS，網頁的美化部分。
px是像素-絕對單位，em:隨著母代的大小變化(如果使用一串會越來越大)，rem:隨著html的大小變化(建議使用比較不會太大)。
vh以及vw，會隨著使用者拉動網頁等比例放大(可以用maxvh來限制)
textstyle:字型的部分。以style裡面的fontfamily來控制。若怕使用者沒有安裝該字型，可以直接從style連結來下載來控制。若怕使用者沒有安裝自行，可以直接從style連結來下載。
background:背景，可以有顏色/圖案，圖案可以決定大小/是否填滿。也可以使用多層的背景。
使用radial-gradient，可以做出許多美美的漸層圖案，例如本頁面使用background-image: radial-gradient(farthest-corner at 40px 40px,rgb(228, 227, 227) 20%,red 105%, rgb(0, 0, 0) 80%);
使用bgc-size來調整背景大小。
border/borderradious:邊框/邊框角度[此效果為border: 1rem solid purple;border-radius: 20% ;]
box-shadow:陰影,似乎不太好用
此效果為 box-shadow:inset 0 -3em 3em rgba(0,0,0,0.1),0 0 0 2px rgb(255,255,255),0.3em 0.3em 1em rgba(0,0,0,0.3);]
overflow:當資料太多時使用，可以用hidden使頁面不至於跑掉，或使用scroll提供使用者自己下拉。
此效果為 overflow: scroll;
opacity:透明度，0~1，1最高。
此效果為 opacity:0.5;