1.shift+alt+f 格式化代碼(vscode) 2.css的複合選擇器 後代選擇器:選後代(不一定是兒子) 空格隔開 如ol li{樣式聲明} 更好地選擇想要的標簽 也可以用class表示 如 .nav.li.a 子選擇器 >親兒子 並集選擇器 逗號 div,p{樣式聲明} 最後一個選擇器 ...
1.shift+alt+f 格式化代碼(vscode)
2.css的複合選擇器
後代選擇器:選後代(不一定是兒子)
空格隔開 如ol li{樣式聲明} 更好地選擇想要的標簽 也可以用class表示 如 .nav.li.a
子選擇器 >親兒子
並集選擇器
逗號 div,p{樣式聲明} 最後一個選擇器 不需要加逗號
3.鏈接偽類選擇器(滑鼠放上去變色)
必須按照LVHA來寫 否則會無效化
用冒號表示
a:link 把沒有點過的鏈接變化 text-decoration:none 刪除下劃線
a:visited 已經訪問過的
a:hover 指針指在上面 更改背景顏色
a:active 活動鏈接 按住滑鼠
給a修改樣式必須單獨修改
4.focous偽類選擇器
input:focus{} bgc背景色 color 內容色
5.css元素顯示
塊元素特點:
獨占一行
高寬內外邊距都可以調整
預設和父親一樣寬
是一個盒子或容器
p標簽裡面不允許再放div
6. span特點
一行可以顯示多個
寬高設置無效
寬度為本身內容寬度
行內只能放行元素 不可以放塊元素 但是a除外
7.行內塊元素
<img><input><text>
可以給寬度也可以給高度
8.元素顯示模式的轉換
在{}裡面填
display:block轉換為塊級元素
display:inline 轉換為行內元素
行內塊 display:inline-block
9. text-indent: 2em;/* 首行縮進 */
10.垂直居中:行高等於盒子的高度 line-height = height
行高等於文字本身的高度加上下空隙 (均分)
行高小於盒子高度偏上反之偏下
11.css的背景
background-color可以為trasparent(透明)也可以是其他顏色
背景圖片的優點是便於控制位置:超大圖片或者logo
background-image:none/url()
背景平鋪:background-repeat :repeat
background-repeat:no-repeat background-repeat:repeat-x 沿著x平鋪 background-repeat:repeat-y沿著y平鋪
背景圖片會壓住背景顏色
background-position 改變圖片在背景的位置
background-position:x y;xy可以是長度也可以是方位名詞
如果只有一個方位名詞,另外一個省略,第二個值預設居中對齊
11.js
prompt 提示框
alert 彈出框
console.log 測試框
var變數聲明
例如: var li
對話框輸入輸出
var myname = prompt('xxx')
alert(myname)