HTML5デフォルトのオーディオプレーヤーCSSスタイル

Question

CSSを使用したデフォルトのオーディオコントロールの再生ボタンの背景色を編集しようとしています。

audio::-webkit-media-controls-play-button { 
    background-color: rgba(0, 0, 0, 0.99); 
} 

そして、この：

はすでにこの試みた

audio::-webkit-media-controls-play-button { 
    background-color: rgba(0, 0, 0, 1); 
} 

を私は取得しています唯一のものは、再生ボタンの画像があることを意味する黒い正方形です。あなたが作品を使用している

Answer 1

スタイルセレクタとスタイル、しかし、それはWebKitのベースのブラウザ上でのみ動作し、ベース-webkit-なので、Chromeであなたのコードを試してみてください、私は次のよう試みたが、それは私のために働い：

<style> 
audio::-webkit-media-controls-play-button { 
    background-color: rgba(230, 230, 255, 1); 
} 
</style> 

デフォルトでは、HTML5オーディオ/ビデオプレーヤーはブラウザのデフォルトコントロールを表示します。あなたが探しているものだけで行うためのjQueryプラグインのトンがありますMediaElement.jsまたはaudio.js

、及び場合：あなたは、CSSとJavascriptを経由して、それらをカスタマイズしたり、@Jainamが示唆したようにjPlayerのようなものを使用するか、またはあなたが使用できることを選んだことができますカスタマイズされたオーディオプレーヤーを表示するだけで、私はこれらのいずれかを使用することをお勧めします。

あなたはあなたのためのオーディオプレーヤーをカスタマイズするには、次の例を見て持つことができます。http://authenticstyle.co.uk/html5-audio-player/