0

ビデオ要素に境界線の半径を追加するにはどうすればよいですか。これが私のコードです。mozilla-firefox では正常に動作しますが、chrome では失敗します。ビデオ要素の境界半径でサポートされている chrome ではありません。

CSS #ビデオ{

-moz-border-radius:40px;
 webkit-border-radius:40px;
 border-radius:40px;

}

HTML:

<video id="video"  style="display:block;margin:0 auto;"></video>

前もって感謝します。

4

2 に答える 2

0

-のがありません-webkit-border-radius。

このCSS トリック ブログは、クロスブラウザー スタイルを見つけるのに非常に役立つことがわかりました。

于 2013-03-09T11:35:24.683 に答える
0
  1. 親divを作成し、境界線の半径を設定します
  2. ビデオを親 div に含めます。

ところで: 最新のブラウザーでは、「--moz-border-radius」と「-webkit-border-radius」の代わりに「border-radius」を使用できます。

例：

<html>
<head>
<style type='text/css'>
.videobox {
    width: 700px;
    border: 5px solid #000;
    border-radius: 40px;
    }
    .video-stream {margin: 30px;}
</style>
</head>
<body>
    <div class="videobox">
        <video class="video-stream"  id=home_video class="video-js vjs-default-skin" controls preload=none width=640 height=264
            poster="http://video-js.zencoder.com/oceans-clip.jpg">
          <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'/>
          <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'/>
          <track kind=captions src="/video-js/captions.vtt" srclang=en label=English />
        </video>
    </div>
</body>
</html>
于 2013-03-09T11:35:49.980 に答える