-
nth-child(n) 定位某個(gè)父元素的一個(gè)或多個(gè)特定的子元素 (n)可以為整數(shù)(1,2,3...)當(dāng)n為整數(shù)時(shí)不能為0,從1算 (n)也可以是多項(xiàng)式,多項(xiàng)式里的n可以為0 例如(n)為(2n)時(shí),表示選中的是2,4,6,8...等等偶數(shù)項(xiàng),一直往后選直到選完
查看全部 -
:last-child 用法與:first-child類(lèi)似 選擇的是元素的最后一個(gè)子元素 例如???div>p:last-child??選擇的是div下的子元素p的最后一個(gè)
查看全部 -
:first-child??表示選擇父元素下的第一個(gè)子元素
div>p:first-child? 表示選擇p元素的父元素下的第一個(gè)子元素
查看全部 -
目標(biāo)選擇器??:target 用來(lái)匹配頁(yè)面中的url的某個(gè)標(biāo)識(shí)符的目標(biāo)元素 即例如?<a?href="#mm">aaa</a> ???????<h1?class="att"?id="mm">?pp</h1> ???????那么點(diǎn)擊aaa時(shí)就會(huì)觸動(dòng)h1標(biāo)簽 ???????css中這樣定義 ???????#mm:target{}
查看全部 -
:empty?偽類(lèi)選擇器 選擇器表示的就是空,用來(lái)選擇沒(méi)有任何內(nèi)容的元素,一個(gè)空格都不行
查看全部 -
否定選擇器??:not 表示選擇除某個(gè)元素外所有元素 例如? div:not[id="aa"]{} 表示的就是div元素下,選擇除了id="aa"的其他所有元素
查看全部 -
根選擇器??:root :root選擇器匹配元素所在文檔的根元素。在HTML文檔中,根元素始終是<html> 所以:root的作用相當(dāng)于直接選擇html 即???:root{}==html{} 建議選擇使用:root選擇器
查看全部 -
屬性選擇器 E[att^="val"]?元素E中?匹配?屬性att以val開(kāi)頭的 E[att$="val"]?元素E中?匹配?屬性att以val結(jié)尾的 E[att*="val"]?元素E中?匹配?屬性att包含了val的
?
查看全部 -
語(yǔ)法縮寫(xiě)如下:
background?:?[background-color]?|?[background-image]?|?[background-position][/background-size]?|?[background-repeat]?|?[background-attachment]?|?[background-clip]?|?[background-origin],...
可以把上面的縮寫(xiě)拆解成以下形式:
background-image:url1,url2,...,urlN;
background-repeat?:?repeat1,repeat2,...,repeatN; backround-position?:?position1,position2,...,positionN; background-size?:?size1,size2,...,sizeN; background-attachment?:?attachment1,attachment2,...,attachmentN; background-clip?:?clip1,clip2,...,clipN; background-origin?:?origin1,origin2,...,originN; background-color?:?color;
注意:
用逗號(hào)隔開(kāi)每組 background 的縮寫(xiě)值;
如果有 size 值,需要緊跟 position 并且用 "/" 隔開(kāi);
如果有多個(gè)背景圖片,而其他屬性只有一個(gè)(例如 background-repeat 只有一個(gè)),表明所有背景圖片應(yīng)用該屬性值。
background-color?只能設(shè)置一個(gè)。
查看全部 -
設(shè)置背景圖片大小?background-size 格式?background-size:auto或?長(zhǎng)度值?或?百分比?或cover?或contain auto:表示默認(rèn)值?,不做改變 長(zhǎng)度值:?jiǎn)挝籶x?成對(duì)出現(xiàn)?設(shè)置寬高 百分比:0%-100%之間?,將背景圖片寬高依次設(shè)置為所在元素寬高乘以前面百分比得出的數(shù)值 cover:填滿整個(gè)區(qū)域 contain:將背景圖片等比縮放至某一邊緊貼容器邊緣為止
查看全部 -
背景剪切??background-clip 格式?background-clip:border-box或padding-box或content-box或no-clip border-box:表示從邊框開(kāi)始剪切 padding-box:表示從內(nèi)邊開(kāi)始剪切 content-box:表示從內(nèi)部區(qū)域開(kāi)始剪切 no-clip:表示不剪切 注意:這里剪切不僅剪切了圖片,而且剪切了背景,即背景顏色也被剪切
查看全部 -
背景圖片顯示的起始位置??background-origin 格式?background-origin:border-box或padding-box或content-box border-box:表示圖片從邊框開(kāi)始顯示 padding-box:表示圖片從內(nèi)邊開(kāi)始顯示 content-box:表示圖片從內(nèi)部區(qū)域開(kāi)始顯示 注意:要想設(shè)置成padding-box和content-box兩種格式,必須把背景設(shè)置為?no-repeat?否則則是默認(rèn)border-box
查看全部 -
文本陰影?text-shadow 格式?text-shadow:水平偏移距離?垂直偏移距離?陰影模糊程度??陰影顏色,可以用rgba色 類(lèi)似的是邊框陰影為??box-shadow
查看全部 -
設(shè)置本地機(jī)器沒(méi)有的字體?@font-face 格式?@font-face{ ??????????font-family:"字體名稱(chēng)"; ??????????src:url("字體在服務(wù)器上的路徑"); ??????} 將@font-face設(shè)置好后,就可以設(shè)置某個(gè)元素的字體為上述定義的字體
查看全部 -
文本溢出省略 格式 text-overflow:ellipsis或clip??表示溢出部分什么方式表示,前者是省略號(hào),后者表示直接剪切 over-flow:hidden???設(shè)置溢出部分隱藏 white-space:nowrap或break-word?設(shè)置文本行為??前者是瀏覽器默認(rèn)設(shè)置,表示控制連續(xù)文本換行,后者表示內(nèi)容將在邊界內(nèi)換行,一般用默認(rèn)方式
查看全部
舉報(bào)
0/150
提交
取消