成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

css偽元素、VScode命令

luckyyulin / 1916人閱讀

摘要:偽元素不是空標(biāo)簽的元素都自帶兩個偽類,只不過平時隱藏了在所有元素前面加?xùn)|西在所有元素后面加?xùn)|西在偽元素里加的東西無法被選取點(diǎn)擊復(fù)制等或做操作等偽類能做元素能擁有的所有屬性,但就是時獨(dú)立的偽元素一般都是隱藏的,需要添加屬性才能現(xiàn)身是給元素添加

::before ::after偽元素

不是空標(biāo)簽的元素都自帶::before、::after兩個偽類,只不過平時隱藏了

before在所有元素前面加?xùn)|西
after在所有元素后面加?xùn)|西

在偽元素里加的東西無法被選?。?b>點(diǎn)擊、復(fù)制等)或做操作(hover、click等)

偽類能做元素能擁有的所有css屬性,但就是時獨(dú)立的

::before、::after偽元素一般都是隱藏的,需要添加css屬性才能現(xiàn)身~~

/*content是給元素添加內(nèi)容; content:""就是給元素添加空內(nèi)容*/
css content: "";
display: block;

簡單來講,::before、::after偽元素就是一個塊級元素的第一個和最后一個元素
其他都一樣,但這兩個元素不能再有子元素的,也沒有hover、click、mouseout等這樣的操作

可以有選擇器:偽類::after、選擇器:偽類::before這樣子的命令來操作偽元素的動態(tài)

div:hover::after{
    color: red;
}

div:hover::before{
    color: red;
}

碎碎念

絕對定位的元素,自動變?yōu)?b>block

box-sizing: border-box;意思是把邊框也算到元素的寬高里去

css動畫:
mdn
變化:transform:rotate
過度:transition

制作進(jìn)度條

兩個div包裹,加上背景色標(biāo)識下就看的清了

對于塊,一定加上寬度width,margin: auto;才有居中的作用

設(shè)置display: inline-block;后會產(chǎn)生空隙
加上vertical-align: top;消除

指針變成手性

cursor: pointer;

想要頁面中的元素能夠動態(tài)的變換位置,請使用絕對定位

text-align: center;letter-spacing: ;
會使文字會居中并向一邊展開
使用text-indent設(shè)置縮進(jìn),令文字看上去從中間向兩邊展開

VScode 常用命令

復(fù)制這一行

shift + alt + uparrow/downarrow

刪除這一行

shift + del

這行上移一行/下移一行

alt + uparrow/downarrow

光標(biāo)切換分窗口

alt + leftarrow/rightarrow

復(fù)制光標(biāo)到每一行

shift + ctrl + alt

選中到下一個符

shift + ctrl

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

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/115954.html

相關(guān)文章

  • less學(xué)習(xí)筆記

    摘要:方便了的編寫和維護(hù)。本文記錄了開發(fā)中最常用的幾種語法。這里的單位可以省略,但是兩者必須有一個帶單位嵌套嵌套是中非常有用高效的語法。學(xué)習(xí)學(xué)習(xí)學(xué)習(xí)在中如果我們需要對這一結(jié)構(gòu)的樣式進(jìn)行渲染,就會使用等選擇器。 一、什么是less less是一種動態(tài)樣式語言,屬于css預(yù)處理語言的一種,它使用類似css的語法,為css賦予了動態(tài)語言的特性,如變量、運(yùn)算、函數(shù)等。方便了css的編寫和維護(hù)。 le...

    MkkHou 評論0 收藏0
  • less學(xué)習(xí)筆記

    摘要:方便了的編寫和維護(hù)。本文記錄了開發(fā)中最常用的幾種語法。這里的單位可以省略,但是兩者必須有一個帶單位嵌套嵌套是中非常有用高效的語法。學(xué)習(xí)學(xué)習(xí)學(xué)習(xí)在中如果我們需要對這一結(jié)構(gòu)的樣式進(jìn)行渲染,就會使用等選擇器。 一、什么是less less是一種動態(tài)樣式語言,屬于css預(yù)處理語言的一種,它使用類似css的語法,為css賦予了動態(tài)語言的特性,如變量、運(yùn)算、函數(shù)等。方便了css的編寫和維護(hù)。 le...

    codercao 評論0 收藏0
  • 前端的一些坑,一些記錄,一些冷知識

    摘要:當(dāng)頁面中元素樣式的改變并不影響它在文檔流中的位置時例如等,瀏覽器會將新樣式賦予給元素并重新繪制它,這個過程稱為重繪。 無限期更新前端的一些坑,一些記錄,一些冷知識https://github.com/ssshooter/... 大概從 17 年的六月份開始記錄吧,也已經(jīng)一年了,其中也包含了一些很簡單的知識,以前還覺得挺難的,現(xiàn)在看起來有點(diǎn)謎之感慨... JavaScript 所有對象...

    Keagan 評論0 收藏0
  • 如何配置透明發(fā)光的騷氣 vscode —— Jinkey 原創(chuàng)

    摘要:開啟透明支持文字發(fā)光樣式,樣式請?jiān)讷@取。如果要不發(fā)光的,可以使用。可以保持更新通知。引入以上大神的樣式配置之后,左邊導(dǎo)航欄有部分標(biāo)題還是未透明狀態(tài),我自己修改了配置,引入即可。如果提示已經(jīng)損壞,選擇右上角齒輪不再提示即可。 原文鏈接 jinkey.ai/post/tech/r… 轉(zhuǎn)載請注明出處 1 安裝自定義 JS 和 CSS 插件 2 安裝發(fā)光主題 showImg(https://us...

    番茄西紅柿 評論0 收藏0
  • 如何配置透明發(fā)光的騷氣 vscode —— Jinkey 原創(chuàng)

    摘要:開啟透明支持文字發(fā)光樣式,樣式請?jiān)讷@取。如果要不發(fā)光的,可以使用??梢员3指峦ㄖ?。引入以上大神的樣式配置之后,左邊導(dǎo)航欄有部分標(biāo)題還是未透明狀態(tài),我自己修改了配置,引入即可。如果提示已經(jīng)損壞,選擇右上角齒輪不再提示即可。 原文鏈接 jinkey.ai/post/tech/r… 轉(zhuǎn)載請注明出處 1 安裝自定義 JS 和 CSS 插件 2 安裝發(fā)光主題 showImg(https://us...

    tylin 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<