在網頁設計中,經常會用到背景透明的樣式,但是又需要字體不受影響,即文字不透明,這時候就需要用到CSS的一些屬性。
/*設置背景透明度*/ background: rgba(255,255,255,0.5); /*設置文字不透明*/ color: rgba(0,0,0,1);
在上述代碼中,我們使用了CSS3新屬性中的rgba來設置背景和文字的顏色,其中第四個參數表示的就是透明度,數值從0到1。
除了使用rgba,我們也可以使用opacity來設置透明度,但是需要注意的是,opacity會對元素內的全部內容產生影響,包括文字。
/*設置背景透明度*/ background: #fff; opacity: 0.5;
在上述代碼中,我們將背景顏色設置為白色,將透明度設置為0.5,但是由于使用了opacity,文字也會變得半透明。
因此,如果需要只對背景進行透明度的設置,而不影響到文字,應該盡量使用rgba屬性。
下一篇vue自動調用