H5與CSS3

HTML5音頻標(biāo)簽

<audio src="http://file.xuanmomo.com/Faded.mp3">您當(dāng)前瀏覽器版本過低,請更換瀏覽器!</audio>
標(biāo)簽內(nèi)的文字只在不認識標(biāo)簽的低版本中顯示
音頻標(biāo)簽基本API:
play():播放
pause():暫停
obj.duration:總時間
obj.currentTime:當(dāng)前時間
obj.volume:音量
obj.ended:是否播放完成(Boolean)
timeupdate事件,返回當(dāng)前播放位置

CSS3 filter(濾鏡) 屬性

filter: none | blur() | brightness() | contrast() | drop-shadow() |  
        grayscale() | hue-rotate() | invert() | opacity() | saturate() | 
        sepia() | url();
提示: 使用空格分隔多個濾鏡。

所有濾鏡實例
以下實例演示了所有濾鏡的使用方法:
.blur {
-webkit-filter: blur(4px);
filter: blur(4px);
}
.brightness {
-webkit-filter: brightness(0.30);
filter: brightness(0.30);
}
.contrast {
-webkit-filter: contrast(180%);
filter: contrast(180%);
}
.grayscale {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.huerotate {
-webkit-filter: hue-rotate(180deg);
filter: hue-rotate(180deg);
}
.invert {
-webkit-filter: invert(100%);
filter: invert(100%);
}
.opacity {
-webkit-filter: opacity(50%);
filter: opacity(50%);
}
.saturate {
-webkit-filter: saturate(7);
filter: saturate(7);
}
.sepia {
-webkit-filter: sepia(100%);
filter: sepia(100%);
}
.shadow {
-webkit-filter: drop-shadow(8px 8px 10px green);
filter: drop-shadow(8px 8px 10px green);
}

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容