亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

css學(xué)習(xí)day04

chuyao / 2779人閱讀

摘要：選擇器屬性選擇器過(guò)濾器在已有選擇器的基礎(chǔ)上進(jìn)行篩選偽類選擇器過(guò)濾器表示結(jié)構(gòu)的表示狀態(tài)的偽元素選擇器添加元素將一個(gè)偽元素添加到選擇到的元素里面的最后面規(guī)則取值關(guān)鍵字位置取消顏色十六進(jìn)制簡(jiǎn)寫(xiě)為函數(shù)關(guān)鍵字漸變色長(zhǎng)度絕對(duì)單位相對(duì)單位當(dāng)前元素

選擇器

屬性選擇器【過(guò)濾器】
在已有選擇器的基礎(chǔ)上進(jìn)行篩選

selector[]
input[type] 
input[type=text] 
input[type^=s] 
input[type$=t] 
input[type*=t]

偽類選擇器【過(guò)濾器】

表示結(jié)構(gòu)的

:first-child
:last-child
:nth-child()
    number/2n+1/even、odd

表示狀態(tài)的

:link
:hover
:active
:visited
:focus

偽元素選擇器【添加元素】
selector::after

將一個(gè)偽元素添加到selector選擇到的元素里面的最后面

ul.nav::after {
    content:"four";
    display:block;
    ...
}


    
    
  • one
    • 
    
  • two
    • 
    
  • three
    • 
    ::after

規(guī)則取值：

        關(guān)鍵字：
            位置 left right center top bottom medium
            取消    none
            ...
        顏色：
            十六進(jìn)制    #ffffff #ededed,簡(jiǎn)寫(xiě)為#fff
            rgb函數(shù)    rgb(0,0,0)
            關(guān)鍵字
            漸變色     linear-gradient
        長(zhǎng)度：
            絕對(duì)單位     px 
            相對(duì)單位 
                em     當(dāng)前元素上的字體大小
                    font-size:12px 
                    1em = 12px
                    2em = 24px
                rem 當(dāng)前html元素中設(shè)定的字體大小
                    html {
                        font-size:10px;
                    }

                    ul {
                        font-size:20px;
                    }
                    li {
                        height:2rem;     //20px
                    }
                % 百分比
                    border-radius:50%

    文本樣式 (可以被繼承)
        line-height
        text-align
        text-decoration
    字體樣式 (可以被繼承)
        color
        font-family     族
            "微軟雅黑" ,"Microsoft YaHei","宋體"
            字體棧

            font-family:"微軟雅黑","Microsoft YaHei",serif;

        font-size         大小
            網(wǎng)頁(yè)默認(rèn)字體為16px
            12px 10px
        font-weight     粗細(xì)
            bold
            thin
            bolder
            100~900 
        font-style     是否打開(kāi)斜體
        line-height 

        font:
        速寫(xiě)，簡(jiǎn)寫(xiě)
        font: font-style font-weight font-size/line-height font-family

        font:normal bold 14px/1.5em "微軟雅黑","Microsoft YaHei"

        網(wǎng)絡(luò)字體
            奇葩字體，（字 -> icon）

---------------------------

1.標(biāo)簽選擇器
2.id選擇器
3.類選擇器
4.普遍選擇器

5.父子選擇器

空格：后代選擇器，后面所有的后代
  > ：子集選擇器，后面的子代

6.兄弟選擇器

  + ：選擇的是緊跟著選擇器的標(biāo)簽
  ~ ：選擇的是選擇器后面所有同級(jí)標(biāo)簽

7.組合選擇器

  交集選擇器：
  并級(jí)選擇器：逗號(hào)相連接

8.屬性選擇器
[type = text]
[type$=t] 有type屬性，并且值以t結(jié)尾
[type^=t] 有type屬性，并且值以t開(kāi)頭
[type*=t] 有type屬性，并且值中含有t
[class~=two] class中包含類名two的

9.偽類選擇器
a.同級(jí)別的

p:first-child:
p:last-child:
p:only-child: 匹配屬于父元素中唯一子元素的 p 元素
p:nth-child(n): 同級(jí)別中第一個(gè)子元素
p:nth-child(odd): 同級(jí)別中所有的奇數(shù)標(biāo)簽
p:nth-child(even): 同級(jí)別中所有的偶數(shù)標(biāo)簽

b.同類型（防止同級(jí)別中類型不同而難以選擇）

p:first-of-type：同級(jí)別中同類型的第一個(gè)標(biāo)簽
p:last-of-type：同級(jí)別中同類型的最后一個(gè)標(biāo)簽
p:nth-of-type(n)：同級(jí)別中同類型的第n個(gè)標(biāo)簽

10.偽元素選擇器

div::before{
  content:"aaa"
}

div::after{
  content:"aaa"
}

p::first-letter{
  選中第一個(gè)字符
}

div::first-line{
  選中一行
}

input::selection{
  選中被選擇的
}

優(yōu)先級(jí)

1.!important
2.若選擇器權(quán)重相同，則就近
3.行內(nèi)：1000
id選擇器: 100
類選擇器，屬性選擇器，偽類選擇器：10
標(biāo)簽選擇器，偽元素選擇器：1

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/116164.html

相關(guān)文章

  • Day04 - Array Cardio 指南一

    摘要：指南一作者簡(jiǎn)介是推出的一個(gè)天挑戰(zhàn)。目的是幫助人們用純來(lái)寫(xiě)東西，不借助框架和庫(kù)，也不使用編譯器和引用?，F(xiàn)在你看到的是這系列指南的第篇。完整指南在從零到壹全棧部落。篩出運(yùn)行結(jié)果是的組成數(shù)組返回。 Day04 - Array Cardio 指南一 作者：?liyuechun 簡(jiǎn)介：JavaScript30 是 Wes Bos 推出的一個(gè) 30 天挑戰(zhàn)。項(xiàng)目免費(fèi)提供了 30 個(gè)視頻教程、30...

    zhangyucha0 評(píng)論0 收藏0

  • 移動(dòng)端H5日歷組件，已廢棄不在維護(hù)

    摘要：默認(rèn)可選回調(diào)函數(shù)，綁定業(yè)務(wù)數(shù)據(jù)。例如某天有日程，則會(huì)在對(duì)應(yīng)日期上標(biāo)識(shí)出一個(gè)小紅點(diǎn)或者其他標(biāo)識(shí)，默認(rèn)傳入數(shù)據(jù)格式必選回調(diào)函數(shù)，當(dāng)你點(diǎn)擊或輕觸某日期后執(zhí)行。 文檔維護(hù)者：孫尊路 喜歡的話，記得star 一下噢！ 適用場(chǎng)景 該組件目前僅適用于移動(dòng)端H5頁(yè)面展示，后期高級(jí)用法中會(huì)講述到如何基于日歷基類實(shí)現(xiàn)自定義模板傳入。（即：開(kāi)發(fā)者只需要傳入自己的模板即可實(shí)現(xiàn)出自己的優(yōu)美的日歷出來(lái)。） 本篇...

    Moxmi 評(píng)論0 收藏0

  • 100天搞定機(jī)器學(xué)習(xí)|Day1數(shù)據(jù)預(yù)處理

    摘要：導(dǎo)入庫(kù)導(dǎo)入數(shù)據(jù)集這一步的目的是將自變量和因變量拆成一個(gè)矩陣和一個(gè)向量。 數(shù)據(jù)預(yù)處理是機(jī)器學(xué)習(xí)中最基礎(chǔ)也最麻煩的一部分內(nèi)容在我們把精力撲倒各種算法的推導(dǎo)之前，最應(yīng)該做的就是把數(shù)據(jù)預(yù)處理先搞定在之后的每個(gè)算法實(shí)現(xiàn)和案例練手過(guò)程中，這一步都必不可少同學(xué)們也不要嫌麻煩，動(dòng)起手來(lái)吧基礎(chǔ)比較好的同學(xué)也可以溫故知新，再練習(xí)一下哈 閑言少敘，下面我們六步完成數(shù)據(jù)預(yù)處理其實(shí)我感覺(jué)這里少了一步：觀察數(shù)據(jù)...

    xeblog 評(píng)論0 收藏0

  • JavaScript 30 - 一起做一次了不起的挑戰(zhàn)

    摘要：加入我們，一起挑戰(zhàn)吧掃碼申請(qǐng)加入全棧部落 JavaScript 30 - 一起做一次了不起的挑戰(zhàn) (Node+Vue+微信公眾號(hào)開(kāi)發(fā))企業(yè)級(jí)產(chǎn)品全棧開(kāi)發(fā)速成周末班首期班(10.28號(hào)正式開(kāi)班，歡迎搶座) 在Github上看到了wesbos的一個(gè)Javascript30天挑戰(zhàn)的repo，旨在使用純JS來(lái)進(jìn)行練習(xí)，不允許使用任何其他的庫(kù)和框架，該挑戰(zhàn)共30天，我會(huì)在這里復(fù)現(xiàn)這30天遇到的挑...

    1treeS 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<