Div和视频,100%的不同高度

时间:2015-03-08 11:40:24

标签: html css

我在<video>内有一个<div><video>的高度设置为100%。页面上的视频高度为759px,div达到764px。没有填充/边距设置,那么我如何最终得到那些5px更多的div?

css for div

.wrapper {
    background: rgba(0, 0, 0, 0.92);
}

css for video

 <video  width="100%" height="100%" poster="poster.jpg" 
                    preload="auto"  autoplay style="visibility: visible; width: 100%; height:100%;border: 0;"  
                    src="test.mp4">
                    <source type="video/mp4" src="test.mp4" >                   
                    </video>

计算视频的css:

border-bottom-color: rgb(138, 138, 138);
border-bottom-style: none;
border-bottom-width: 0px;
border-image-outset: 0px;
border-image-repeat: stretch;
border-image-slice: 100%;
border-image-source: none;
border-image-width: 1;
border-left-color: rgb(138, 138, 138);
border-left-style: none;
border-left-width: 0px;
border-right-color: rgb(138, 138, 138);
border-right-style: none;
border-right-width: 0px;
border-top-color: rgb(138, 138, 138);
border-top-style: none;
border-top-width: 0px;
box-sizing: border-box;
color: rgb(138, 138, 138);
display: inline-block;
font-family: Raleway, 'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size: 14px;
height: 759px;
line-height: 20px;
object-fit: contain;
visibility: visible;
width: 1349px;

为div计算

Show inherited properties
-webkit-background-clip: border-box;
-webkit-background-origin: padding-box;
-webkit-background-size: auto;
background-attachment: scroll;
background-clip: border-box;
background-color: rgba(0, 0, 0, 0.921569);
background-image: none;
background-origin: padding-box;
background-size: auto;
box-sizing: border-box;
color: rgb(138, 138, 138);
display: block;
font-family: Raleway, 'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size: 14px;
height: 764px;
line-height: 20px;
width: 1349px;

1 个答案:

答案 0 :(得分:-1)

如果我理解你想要的东西,那么这里有一个解决方案:

<video style="border: 0;">
Your browser dont support video tags.
</video>

每个视频代码都会自动显示边框值,这可能就是您的视频代码具有错误属性的原因。