Думаю веб мастера часто ставя плеер с канала
YouTube выставляют ему значение, чтоб корректно смотрелось, но можно автоматически сделать. Это не только касается
ютуб, а других сторонних ресурсов, которые раздают плееры. Что теперь вы один раз выставите ширину и высоту по своему каркасу, что после этого вы автоматически ставите и все преображается как вы выставили значение. Чтоб видео ролики автоматически подстраивались под те значение, что изначально выставлено под родительский блог, то в стилях их задаем.
Здесь реализуем вставки iframe, object и embed, на которые редактируем и подстраиваем. Что изначально все нужно проставить или прописать все варианты. И после этого все сохраняем и забываем про лишнее действие, что делали ранее. Этот отличный инструмент подойдет под кино сайты, что меняют шаблоны, а как знаем у каждого своя фиксированная ширина, что все можно на стилях исправить и сделать вывод корректным.
1. Способ
Для того чтобы сделать видео из
YouTube адаптивным, нужно сделать следующее
Вставить тэг
iframe с видео
Код
<div class="myvideo">...</div>
то есть сделать так:
Код
<div class="myvideo">
<iframe width="560" height="315" src="//www.youtube.com/embed/kPYBn8VcdXk" frameborder="0" allowfullscreen></iframe>
</div>
В таблицу стилей в самый низ прописать такой код:
Код
.myvideo {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
border:1px solid #ccc;
}
.myvideo iframe,.myvideo object,.myvideo embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
2. Способ
Плеер располагается в
div, что под стилями.
Код
<div class="video-responsive">
<iframe width="auto" height="auto" src="ссылка на видео" frameborder="0" allowfullscreen></iframe>
</div>
Выставляем по умолчанию, что сразу в дальнейшем все идет автоматически и веб мастер избавляется от лишней настройки.
CSS
Код
.video-responsive {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow:hidden;
}
.video-responsive iframe,
.video-responsive object,
.video-responsive embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Не выводит сообщения в чат.
Игор приносим свои извинения за предоставленные не удобства, сайт проходит перекваливфикацыю, по эт
Спасибо, вы не виноват, эта все zornet не указывает авторов и источник, если ему так написать то ба
