
Si alguna vez has insertado 、 ビデオ の YouTube en alguna de tus ウェブサイト habrás notado que el vídeo guarda un ancho fijo y que éste no es responsivo cuando cambias el サイズ del navegador o cuando ves tus páginas webs desde otros デバイス con distintos tamaños de pantalla (携帯, 錠剤,…).
Ya en un artículo anterior vimos como podías insertar un vídeo de Youtube directamente en tu página web, y en el caso de que uses ワードプレス, sin necesidad de ningún tipo de プラグイン.
Para hacer que el 幅 の、 ビデオ insertado, a partir del código HTML que Youtube nos dá, は responsivo, lo primero que haremos será meter dicho código dentro de un DIV.
1 2 3 4 5 6 7 | <div class="contenedor"> <iframe src="http://www.youtube.com/embed/NUsoVlDFqZg" frameborder="0" allowfullscreen="allowfullscreen" class="video"> </iframe> </div> |
Puedes usar el コード aquí mostrado, と 置換 、 ルート por la ruta que te dé YouTube del vídeo que quieras 挿入. Ten en cuenta que debes asignar la clase ビデオ al elemento IFRAME.
その後、, en tu archivo CSS 対応します。, o directamente bajo un elemento STYLE en la misma página, つもりです。 asignar los atributos de estilo para la clase コンテナー と ビデオ.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | .contenedor { position: relative; height: 0px; width: 100%; padding-bottom: 56.25%; } .video { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } |
Una vez introducido este código, 場合 refrescas de nuevo la página donde hayas insertado el vídeo, comprobarás que ahora éste se ajusta に、 幅 の、 DIV que lo contiene. 東はい DIV está situado directamente sobre el BODY, それが表示されます。 reajusta に、 ancho de la pantalla.

「1 つの思想」どのように応答性や調節可能です, 全幅, Youtube から埋め込まれたビデオ”
Me sirvió mucho, busque en muchas paginas y nada! que alivio , どうもありがとうございます <3