內聯樣式
內部樣式
外部樣式
@import url(./css.css);
單詞表示法(color:yellow)十六進製制表示法(color:#333333)
rgb三原色表示法(範圍0-255)(rgb(0,0,0))
background-color 規定要使用的背景顏色
background-position 規定背景影象的位置值:x,y(top|center|bottom|left|right|百分率|px等)
background-size 規定背景的尺寸值:length(設定寬高)|percentage(百分號)|cover(鋪滿)|contain(適應寬高);
background-repeat 規定如何重複背景影象值: repeat 預設。背景影象將在垂直方向和水平方向重複。
repeat-x 背景影象將在水平方向重複
repeat-y 背景影象將在垂直方向重複
no-repeat 背景影象將僅顯示一次
background-origin 規定背景的定位區域值: padding-box 背景影象相對於內邊距框來定位
border-box 背景影象相對於邊框盒來定位
content-box 背景影象相對於內容框來定位
background-clip 規定背景的繪製區域值: border-box 背景被裁剪到邊框盒。 測試
padding-box 背景被裁剪到內邊距框。 測試
content-box 背景被裁剪到內容框。
background-attachment 規定背景影象是否固定或者隨著頁面的其餘部分滾動值: scroll 預設值。背景影象會隨著頁面其餘部分的滾動而移動。
fixed 當頁面的其餘部分滾動時,背景影象不會移動
background-image 規定要使用的背景影象值: url(『url』) 指向影象的路徑。
none 預設值。不顯示背景影象。
復合樣式:background:red url() repeat 0 0;(顏色 背景圖 平鋪方式 位置)
border-widththin 定義細的邊框
medium 預設。定義中等的邊框
thick 定義粗的邊框
length 允許您自定義邊框的寬度(10px)
border-stylenone 定義無邊框。
hidden 與 「none」 相同。不過應用於表時除外,對於表,hidden 用於解決邊框衝突。
dotted 定義點狀邊框。在大多數瀏覽器中呈現為實線。
dashed 定義虛線。在大多數瀏覽器中呈現為實線。
solid 定義實線。
double 定義雙線。雙線的寬度等於 border-width 的值。
groove 定義 3d 凹槽邊框。其效果取決於 border-color 的值。
ridge 定義 3d 壟狀邊框。其效果取決於 border-color 的值。
inset 定義 3d inset 邊框。其效果取決於 border-color 的值。
outset 定義 3d outset 邊框。其效果取決於 border-color 的值。
border-color:邊框顏色
border-collapseseparate 預設值。邊框會被分開。不會忽略 border-spacing 和 empty-cells 屬性。
collapse 如果可能,邊框會合併為乙個單一的邊框。會忽略 border-spacing 和 empty-cells 屬性。
font-family:字型
fotn-size:字型大小
font-weight:字型粗細(單詞[normal正常、bold加粗]; 數字[100-500正常、600-900加粗])
font-style:normal 預設值。瀏覽器顯示乙個標準的字型樣式。
italic 瀏覽器會顯示乙個斜體的字型樣式。
oblique 瀏覽器會顯示乙個傾斜的字型樣式。
text-decoration:文字修飾underline下劃線
line-through刪除線
overline上劃線
none不新增任何修飾
text-transform:文字大小寫lowercase小寫
uppercase大寫
capitalize首字母大寫
text-indent:文字縮排(單位em)
text-align:文字對齊方式left預設
right
center
justify(兩端點對齊,中間自行調節)
line-height:行高
letter-spacing:字間距
word-spacing:詞間距(english)
word-breaknormal 使用瀏覽器預設的換行規則。
break-all 允許在單詞內換行。
keep-all 只能在半形空格或連字元處換行。
id選擇器(#css{})
class選擇器(.css{})
標籤選擇器(p{})
群組選擇器/分組選擇器(div,p,span{})
通配選擇器(*{})
層次選擇器後代選擇器:選中.css元素內部後代所有p元素(.css p{})
子代選擇器:選中.css元素內部子元素p(.css>p{})
兄弟選擇器:選中.css元素後面的所有某一類兄弟元素p(.css~p{})
相鄰選擇器: 選中.css元素後面的某乙個相鄰的兄弟元素p(.css+p{})
屬性選擇器div[class]{}
div[class][id]{}
div[class=box]{}
div[class*=search]{} //只要search在class**現過都可以選中
=:完全匹配 *=:部分匹配 ^=:起始匹配 $=:結束匹配
偽類選擇器:link 訪問前的樣式(只能給a標籤)
:visited 訪問後的樣式(只能給a標籤)
:hover 滑鼠移入時的樣式(可以給所有標籤)
:active 滑鼠按下時的樣式(可以給所有標籤)
如果四個偽類都生效,順序為:l v h a
偽元素選擇器div:after
div:before
:checked、:disabled、:focus 都是針對表單元素
結構性偽類選擇器:nth-of-type(){}、:nth-child(){} 角標從1開始,n值表示從0到無窮大即都被選中,隔行換色(2n)(2n+1)
選中第一項 :first-of-type{} :first-child{}
選中最後一項 :last-of-type{} :last-chile{}
只有一項的時候被選中 only-of-type{}
float是魔鬼,會影響其他相鄰元素;但是clear是小白,其只會影響自身,不會對其他相鄰元素造成影響
clear語法:clear : none | left | right | both
取值:none : 預設值,不抗浮動
left : 左側抗浮動
right : 右側抗浮動
both : 兩側抗浮動
float語法:clear : none | left | right
取值:none : 預設值,不使用浮動
left : 左浮動
right : 右浮動
dhu複試基礎 66 加密
編寫乙個加密程式,用來加密乙個字串。加密規則如下 把字串中的所有數字0 1 9分別換成小寫英文本母a b j。把字串中的所有小寫英文本母a b j分別換成數字0 1 9。其它字元保持不變。你的程式需要從標準輸入裝置 通常為鍵盤 中讀入多組測試資料。每組輸入資料佔一行,其中只包含乙個字串,即需要被加密...
css學習 css基礎
子選擇器 parent child 子選擇器是指選擇parent的範圍內的第乙個子元素。這裡parent和child均是偽 可以是class用.classname,也可以是標籤ul li,也可以是id pid cid 後代選擇器 parent child 後代選擇器是指 選擇parent範圍內的所欲...
Python學習第66天(css內外邊距)
今天聽這個css課程,感覺這個老師真的講的很爛,明明可以很輕鬆理解,非得扯上一堆的if什麼的,明明很容易就能理解,硬生生給我說懵了。內外邊距倒是蠻有意思的 內邊距,自然就是塊級標籤自己內部的一些距離,然後外邊距,就是標籤和同級標籤之間的距離 margin 用於控制元素與元素之間的距離 margin的...