CSS - Hacer que un vídeo ocupe todo el ancho de pantalla, pero no aumente la altura

 
Vista:
Imágen de perfil de Novato
Val: 2
Ha aumentado su posición en 16 puestos en CSS (en relación al último mes)
Gráfica de CSS

Hacer que un vídeo ocupe todo el ancho de pantalla, pero no aumente la altura

Publicado por Novato (1 intervención) el 05/07/2020 22:49:29
Buenas tardes, me gustaría poner un vídeo como el de esta página:

https://puertadebaldur.com/inicio/
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de jhon
Val: 48
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Hacer que un vídeo ocupe todo el ancho de pantalla, pero no aumente la altura

Publicado por jhon (13 intervenciones) el 11/08/2020 01:18:33
no soy programador, pero vi alguna vez que con las propiedades view lo hacian en css sin ocupar mas alla de lo que ocupaba la pantalla el lugar de usar px o % ... espero se lo que buscas
https://stackoverflow.com/questions/21624014/css-are-view-height-vh-and-view-width-vw-units-widely-supported

CSS: ¿Se admiten ampliamente las unidades de altura de vista (vh) y ancho de vista (vw)?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Lopez
Val: 160
Bronce
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Hacer que un vídeo ocupe todo el ancho de pantalla, pero no aumente la altura

Publicado por Lopez (38 intervenciones) el 11/08/2020 01:33:30
Hola Novato,
Te recomiendo pases por este hilo. Justamente ayudamos a un colega con la misma duda.
https://www.lawebdelprogramador.com/foros/HTML/1754360-No-me-funciona-el-atributo-autoplay-de-la-etiqueta-video-de-HTML.html

Si quieres ver un ejemplo de como poner un video: https://codepen.io/lowpez/pen/yLOLKej

Lo primero es darle al body un ancho completo, por eso declaramos en el CSS:
1
html, body { width:100%; height:100%; margin:0; padding:0; }

Seguido metemos el código del video dentro de un div (El que contendrá al video)

1
2
3
4
5
6
7
<div>
    <video id="video" style="width:100%; ">
        ....
    </video>
</div>
<div class='content'>
    ....

Y eso es en base. Un poquito de CSS extra vendría bien para posicionar el restod e elementos.
Quedamos atentos,
Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar