1

Web サイトで再生中のビデオの周りに赤い枠を付けたいです。ここに私のコードがあります。

    <div class="yotube_video">
        <video width="700" height="525" controls="controls" scrolling="no" >
            <source src="video/promo_video.mp4" type="video/mp4">
        </video>
    </div>

とスタイルシートが含まれています

div.youtube_video{
border:5px solid red;}

ビデオの周囲に境界線が表示されないのはなぜですか。助けてください。また、ビデオをより芸術的にするためのオンライン ヘルプはありますか?

前もってありがとう、aqzr

4

3 に答える 3

5

あなたが書いたHTMLで：

<div class="yotube_video">

次に、CSS に次のように記述しました。

div.youtube_video

HTML と CSS のクラス名は同じにする必要があります。HTML ファイルで「u」を忘れました。次のようになります。

HTML

<div class="youtube_video">
<video width="700" height="525" controls src="video/promo_video.mp4" type="video/mp4">
</video>
</div>

controls="controls"存在しません。controlsそれらを有効にしたい場合は、書くだけです。scrolling存在しません。source次に、さまざまなブラウザー用にさまざまな形式でエンコードされた複数のソース ファイルを提供する場合にのみ、タグが必要になります。あなたの例では、それは必要ないはずです。使うsrcだけで十分です。

CSS

div.youtube_video{
border:5px solid red;}

とにかくvideo、より良いセマンティックを提供するために HTML5 で導入された新しいタグであるタグを使用しているので、ラッピングの使用を避けて、ID またはクラスをタグdivに直接与えることができます。videoしたがって、HTMLは次のようになります。

<video class="youtube_video" width="700" height="525" controls src="video/promo_video.mp4" type="video/mp4">
</video>

CSSは次のようになります。

.youtube_video{
    border:5px solid red;}

ここにデモがあります

于 2013-01-01T06:16:01.000 に答える
1 
div.yotube_video{
border:5px solid red;
}

上記のクラス名は yotube_video で、youtube_video と入力しました

于 2013-01-01T06:06:48.457 に答える
0

videoにない要素にクラスを適用するdiv

video{
   border:5px solid red;
}

フィドルはここにあります

またはこれを行う他の方法は次のとおりです

IDあなたはあなたのvideo要素のを次のように提供することができます

<div>
        <video id="yotube_video" width="700" height="525" controls="controls" scrolling="no" >
            <source src="video/promo_video.mp4" type="video/mp4">
        </video>
 </div>

そしてそれに適用CSSしIDます

#yotube_video{
     border:5px solid red;
}

フィドルはここにあります

于 2013-01-01T06:01:36.357 に答える