###### tags: `HTML助教作業` # 第一週作業 第一週作業主要是讓同學們了解基本的HTML標籤,以及如何用Table標籤做出自己的課表並利用CSS改變樣式,可以視情況而定看要不要加入CSS的部分,也可以單純建立課表就好,介紹標籤的時候要記得灌輸同學屬性(attr)的觀念。 CSS的部分要讓同學利用選取器與pseudo-class來改變樣式。 標籤的部分除表格外,要讓同學練習用label的for屬性,讓滑鼠點擊label後自動focus到input上。 ***學習重點*** - 學習如何建立表格(以及標頭) th會預設粗體 - 學習如何設定 "rowspan" 和 "colspan" - 學習幫元素上class並利用pseudo-class去設定元素style(常用) - 學習利用box-shadow製造出陰影效果(常用) - 學習利用border設定邊框 - 熟悉label for ***重點語法*** - element::first-letter - element::selection - element:hover ***作業要求*** 利用表格標籤打造一個自己的課表,CSS和下面的標籤可選擇要或不要,但至少要讓同學知道基本常用的標籤。 <iframe src="https://codesandbox.io/embed/diyicizuoye-9idwd?fontsize=14&hidenavigation=1&theme=dark" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" title="第一次作業" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts" ></iframe>
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up