# html 1/18 概念
###### tags: `html`

https://medium.com/%E7%8B%97%E5%A5%B4%E5%B7%A5%E7%A8%8B%E5%B8%AB/7-%E5%80%8B%E4%BD%A0%E5%BF%85%E9%A0%88%E7%9F%A5%E9%81%93%E7%9A%84semantic-elements-ccc8bbad5d
音樂圖片使用者開發功能通通擺web server
包含(name)
# 13-1 HTML5新元素
section=區段
header=頁首
footer=頁尾
article網頁主要
aside次要
nav導覽
figure圖片相片程式碼
除了figure通通沒有預設樣式，要用css來設定
# 13-2 Structural Semantic Elements
每一頁都要長一樣=版型
用`<table>`去做
`<frameset>`框架式頁面=5個html 容易發生錯誤
`<div>`=block元素可裝inline或所有元素
可根據需求做出想要的樣式 每個區塊都是div
缺點:(每個div 都要用不同的命名 瀏覽器指認div不認內容 效率差 由上而下慢慢查)
# 13-3 針對不支援這些元素的瀏覽器
figure裡面的img圖片大小300
figcaption就需要設定為300
img大小=figcaption大小
# 14-1 Input type屬性的新類型
日期時間=(date日期,datetime-local本地日期時間,local=本地時間,month月,time時,week週)
文字方塊=(email信箱,url(收尋)網址,tel電話,search新的輸入文字方塊類型x=del)
URL必須完整網址or http://
color顏色
range數值型執行輸入(粗略)
number精準數值(精確)
# 14-2 表單驗證類型的屬性
範圍驗證屬性(min最小,max最大,step属性规定输入字段的合法数字间隔)
一般驗證屬性(required填寫屬性,maxlength最長長度,pattern驗證格式是否正確)
LRSY身分證開頭沒有了合併掉(2010.12.25 Y(1975))
# 14-3 form attribute
autofocus游標停留屬性
placeholder取代掉前面屬性
autocomplete關掉元素
readonly只能夠放在輸入文字的元素(後台可收到傳值)
datalist資料清單
disabled沒辦法做任何功能(點不到傳值)
size寬度
multiple下拉式選單可選多個
datalist要+id=(list="urllist")
# 15-1 特殊字元的使用
開始是and&結束分號;
# 15-2 字型樣式進階設定
font-family(字型命名)
外掛:
https://fonts.google.com/
https://shubo.io/preload-prefetch-preconnect/
@import必須擺第一行
@import擺外掛檔也是第一行
多個外掛檔連接
``<link rel="stylesheet" href="styles//ss.css">``
# 15-3 文字樣式屬性
文字的值一定要大於字體大小
line-height>要大於字
上下平均分配
div區塊(vertical-align)無效的
vertical-align只能在td
line-height如果擺在div就需要大小跟div依樣(div要定高度)
# 16-1 文字多欄版面
# 16-2 背景樣式(background)
body textarea多行輸入
# 16-3 背景樣式(background)
如果兩個值只給一個值 就會在正中間
background-position用在不重複貼
# 17-1.3 display樣式&visibility樣式
可否顯示
none不占任何空間
可否可見
# 17-2 overflow樣式
常用auto
overflow設定元件容器顯示
# 18-1定位(position)
static依照排列順序
relative指定它在位子

# 18-2陰影
# 18-3Media Querise
all
screen
print
speech
# 18 Media Queries
# Media Queries語法
or(,或) 直接寫英文"and(兩個都要成立) not(只要不式它) only(只有)"
寫在style裡面

# Media Queries範例

# ico
用圖片
小畫家裁剪->https://www.ifreesite.com/favicon/ ->
->檔名必須為(favicon.ico)且不能更改->
->

# 題外:
老師遇到的問題:
找不到年 老人家歧視