Responsiewe webontwerp - video's
Gebruik die breedte-eienskap
As die width
eiendom op 100% gestel is, sal die videospeler reageer en op en af skaal:
Voorbeeld
video {
width: 100%;
height: auto;
}
Let daarop dat die videospeler in die voorbeeld hierbo opgeskaal kan word om groter as sy oorspronklike grootte te wees. ’n Beter oplossing sal in baie gevalle wees om eerder die
max-width
eiendom te gebruik.
Gebruik die maksimum-breedte-eienskap
As die max-width
eiendom op 100% gestel is, sal die videospeler afskaal as dit moet, maar nooit opskaal om groter as sy oorspronklike grootte te wees nie:
Voorbeeld
video {
max-width: 100%;
height: auto;
}
Voeg 'n video by die voorbeeldwebblad
Ons wil 'n video by ons voorbeeldwebblad byvoeg. Die video sal verander word om altyd al die beskikbare spasie op te neem:
Voorbeeld
video {
width: 100%;
height: auto;
}