css中可利用filter屬性和brightness()函數(shù)實(shí)現(xiàn)低亮度顯示,filter屬性用于定義圖片元素的可視效果,配合brightness()函數(shù)使用可設(shè)置元素的明暗樣式,語法“元素{filter:brightness(明暗值)}”。
創(chuàng)新互聯(lián)建站堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:成都網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的邢臺(tái)縣網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!
本教程操作環(huán)境:windows10系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css3怎樣實(shí)現(xiàn)低亮度
在css中,想要實(shí)現(xiàn)低亮度,可以利用filter屬性。
filter 屬性定義了元素(通常是)的可視效果(例如:模糊與飽和度)。
brightness()函數(shù)給圖片應(yīng)用一種線性乘法,使其看起來更亮或更暗。如果值是0%,圖像會(huì)全黑。值是100%,則圖像無變化。其他的值對(duì)應(yīng)線性乘數(shù)效果。值超過100%也是可以的,圖像會(huì)比原來更亮。如果沒有設(shè)定值,默認(rèn)是1。
示例如下:
左面低亮度,右面原亮度:
注意: Internet Explorer 或 Safari 5.1 (及更早版本) 不支持該屬性。
輸出結(jié)果:
(學(xué)習(xí)視頻分享:css視頻教程)