Проблема с тегами видео-тегов

Я хочу, чтобы видео-тег был прикреплен к верхней части (или снизу от элемента над тегом видео). Когда один изменяет размер окна с использованием текущего кода, который я использую, элемент видео также удалит себя сверху (или снизу от элемента выше в иерархии в HTML). Есть ли способ предотвратить распространение видео с его вершины? Я предполагаю, что это связано с тем, что тег видео пытается сохранить его соотношение и может иметь какое-то отношение к ширине: 100%.Проблема с тегами видео-тегов

Я сделал JSFiddle here и вот мой код:

HTML:

<div class="background-video"> 
    <video autoplay loop muted> 
    <source src="somevideo.mp4" type="video/mp4"> 
    </video> 
</div>

CSS:

.background-video 
{ 
    position: relative; 
} 

.background-video video 
{ 
    position: absolute; 
    top: 0; 
    right: 0; 
    left: 0; 
    margin: 0 auto; 
    height: 1080px; 
    width: 100%; 
}

Так как мне сделать это так, чтобы тег видео не изменить размер в неприятном виде и по-прежнему заполняет пространство правильно?

источник

2016-02-05 Barrosy

вы имеете высоту установленные в 1080px, а ширину до 100% , Таким образом, высота всегда будет оставаться неизменной, но ширина будет масштабироваться. Вы пробовали использовать 'height: auto' – JamieC

также, ваша скрипка не работает, так как вам нужно ссылаться на фактическое видео. – JamieC

Да, но речь идет не о самом видео, а только о видеотеке, он, как предполагается,« заполняет любые источник видео, который вы хотите ". – Barrosy

Вы должны добавить вам CSS эту линию для чувствительных элементов видео, изображения, IFRAME и т.д.

CSS

audio, iframe, img, video { 
max-width: 100%; 
}

источник

2016-02-05 16:11:50

Проблема с тегами видео-тегов

ответ

Смежные вопросы