サポート サポート問い合わせ先 | システムステータス システムステータス
ページ内容

    プレイリストのスタイル設定

    このトピックでは、プレイリストをスタイルする方法を学習します。

    概要

    プレイリストの外観を変更する場合は、CSSを使用して変更できます。 この文書では、変更可能なスタイルがいくつか表示されます。 もちろん、可能な変更は数多くあり、タスクを達成するために正しいセレクターを見つける必要があります。

    垂直再生リストのスタイル設定

    次の図は、垂直再生リストのスタイルをまとめたものです。 ダイアグラムに続いて、スタイルを一覧表示する表があります。

    プレイリストのテキストの色を制御する .vjs-mouse.vjs-playlist {
    色:#E9D2B3;
    }
    色をコントロールする
    プレイリストアイテム間のスペース
    .vjs-mouse.vjs-playlist {
    背景色:#161D6E;
    }
    期間テキストの色を制御する .vjs-playlist .vjs-playlist-duration {
    色:#9BBNNXXDA;
    }
    デュレーションバックグラウンドの色を制御する .vjs-playlist .vjs-playlist-duration {
    背景色:#1160AA;
    }
    プレイリストアイテム間のスペースを制御する .vjs-playlist-vertical .vjs-playlist-item {
    マージントップ:20px。
    }

    水平再生リストのスタイル設定

    次の図は、水平再生リストのスタイルをまとめたものです。 ダイアグラムに続いて、スタイルを一覧表示する表があります。

    プレイリストのテキストの色を制御する .vjs-mouse.vjs-playlist {
    色:#E9D2B3;
    }
    色をコントロールする
    プレイリストアイテム間のスペース
    .vjs-mouse.vjs-playlist {
    背景色:#161D6E;
    }
    期間テキストの色を制御する .vjs-playlist .vjs-playlist-duration {
    色:#9BBNNXXDA;
    }
    デュレーションバックグラウンドの色を制御する .vjs-playlist .vjs-playlist-duration {
    背景色:#1160AA;
    }
    プレイリストアイテム間のスペースを制御する .vjs-playlist-horizo​​ntal .vjs-playlist-item {
    margin-left:5px。
    }

    スクロールバーを非表示にする

    水平再生リストのスクロールバーは不要ですが表示されます。 スクロールバーを非表示にしたい場合は、次のスタイルを使用します。

    div.vjs-playlist.vjs-playlist-horizontal {
      overflow-y: hidden;
    }

    次のスクリーンショットは、プレイリストに表示されているスクロールバーを表示し、非表示にしています。


    ページの最終更新日:28年2020月XNUMX日