資訊專欄INFORMATION COLUMN
摘要：這種情況是綠色背景色沒(méi)有被透上來(lái)將小方塊背景色改為紅色，白色透明邊框變成了紅色透明邊框，綜上兩點(diǎn)，說(shuō)明透明邊框的顏色隨著背景色而變化。
這種情況是綠色背景色沒(méi)有被透上來(lái)
將小方塊背景色改為紅色，白色透明邊框變成了紅色透明邊框，
綜上兩點(diǎn)，說(shuō)明透明邊框的顏色隨著背景色而變化。注意是透明邊框！
那么如何將綠色背景在透明邊框中透明上來(lái)呢，，
用到css3的一個(gè)屬性，，background-clip: border-box ,padding-box
border-box表示在border，padding，width中將綠色背景裁掉
padding-box表示在padding,width 中將綠色背景裁掉
實(shí)例如下：
將上述加上此屬性，則
綠色背景通過(guò)透明邊框透明出來(lái)！
有疑問(wèn)一起探討學(xué)習(xí)呀，前端醬油芝士一枚！
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/117556.html
摘要：過(guò)去在學(xué)習(xí)的時(shí)候，首要任務(wù)就是要理解，因?yàn)槭抢镱^很重要的模型概念，描述了與的空間定位，今天的項(xiàng)目竟然卡在一個(gè)簡(jiǎn)單的小問(wèn)題，因此就用一篇文章做個(gè)紀(jì)錄提醒自己不要忘記，也避免之后遭遇到又會(huì)卡住了。 過(guò)去在學(xué)習(xí)CSS的時(shí)候，首要任務(wù)就是要理解box model，因?yàn)閎ox model是CSS里頭很重要的模型概念，描述了padding、margin、border與content的空間定位，今天...
摘要：過(guò)去在學(xué)習(xí)的時(shí)候，首要任務(wù)就是要理解，因?yàn)槭抢镱^很重要的模型概念，描述了與的空間定位，今天的項(xiàng)目竟然卡在一個(gè)簡(jiǎn)單的小問(wèn)題，因此就用一篇文章做個(gè)紀(jì)錄提醒自己不要忘記，也避免之后遭遇到又會(huì)卡住了。 過(guò)去在學(xué)習(xí)CSS的時(shí)候，首要任務(wù)就是要理解box model，因?yàn)閎ox model是CSS里頭很重要的模型概念，描述了padding、margin、border與content的空間定位，今天...
摘要：過(guò)去在學(xué)習(xí)的時(shí)候，首要任務(wù)就是要理解，因?yàn)槭抢镱^很重要的模型概念，描述了與的空間定位，今天的項(xiàng)目竟然卡在一個(gè)簡(jiǎn)單的小問(wèn)題，因此就用一篇文章做個(gè)紀(jì)錄提醒自己不要忘記，也避免之后遭遇到又會(huì)卡住了。 過(guò)去在學(xué)習(xí)CSS的時(shí)候，首要任務(wù)就是要理解box model，因?yàn)閎ox model是CSS里頭很重要的模型概念，描述了padding、margin、border與content的空間定位，今天...
摘要：這是默認(rèn)值背景圖片延伸到邊框，但是圖片的起始位置是從開(kāi)始的。偏移差別很明顯吧問(wèn)題是背景圖片定位在右下角，據(jù)底部和右邊，且容器大小不固定解決方案一種方法是在偏移量前面指定關(guān)鍵字。更改元素寬高，邊框依然是連續(xù)的。 背景與邊框 半透明邊框 知識(shí)點(diǎn) background-clip: [border-box] |[padding-box] | [content-box]; hsla(, , ,...
閱讀 1960·2021-11-15 17:58
閱讀 2140·2021-10-19 11:45
閱讀 3510·2021-09-02 15:40
閱讀 2606·2021-07-25 10:50
閱讀 3758·2019-08-30 15:56
閱讀 3158·2019-08-30 12:44
閱讀 1039·2019-08-26 13:38
閱讀 1882·2019-08-23 18:29
