一芯急、關(guān)于scoped的一些問題
1.scoped的作用
scoped的目的是為了解決組件樣式私有化的問題,
使用:只需要在組件樣式的標(biāo)簽中加入scoped娶耍,這樣樣式只會(huì)在本組件中起作用
image.png
加入scoped的樣式在瀏覽器渲染的時(shí)候會(huì)添加一個(gè)唯一的標(biāo)識(shí)
image.png
注意:如果組件內(nèi)部還有組件,他只會(huì)給最外層的組件添加唯一的標(biāo)識(shí)榕酒,不會(huì)影響內(nèi)部的組件,
1想鹰,子組件中有scoped紊婉,父組件中沒有辑舷,父組件是不可以操作子組件的樣式的,相反何缓,如果父組件中有scoped肢础,子組件無碌廓,他也不會(huì)影響子組件的樣式。
2.scoped需要慎用谷婆,在使用scoped的過程中會(huì)出現(xiàn)一些問題慨蛙,
問題是:在組建中添加scoped之后,有些樣式是不起作用的股淡,樣式無法設(shè)置到指定的標(biāo)簽上
解決辦法:使用深度作用選擇器/deep/
image.png
樣式查看:
image.png
失敗方案:
image.png
image.png
注意:關(guān)于具體的介紹可以查看文檔vue-loader網(wǎng)址:https://vue-loader.vuejs.org/zh/guide/scoped-css.html#%E6%B7%B7%E7%94%A8%E6%9C%AC%E5%9C%B0%E5%92%8C%E5%85%A8%E5%B1%80%E6%A0%B7%E5%BC%8F
二、學(xué)習(xí)到的知識(shí)點(diǎn)
樣式中設(shè)置背景顏色--background-color
1.background-color是設(shè)置背景顏色
2.background-color我們經(jīng)常給的賦值是一種純顏色贾铝,我們的賦值一般為(顏色名字,顏色的十六進(jìn)制埠帕,顏色的rgb)
image.png
注意: background-color還有倆種賦值--默認(rèn)值transparent和inherit
其中transparent默認(rèn)值,表示顏色為透明
image.png
inherit 規(guī)定是沖父元素繼承background-color屬性
image.png
問題:至于transparent和inherit的區(qū)別我還得在看看叁巨,