Web Design Responsiv - Videoclipuri. Utilizarea proprietății width. Utilizarea proprietății max-width. Adăugați un videoclip la pagina web.
Partajeaza in Google Classroom
Teorie: Descriere video Descarcă PDF
Utilizarea proprietății width
Dacă proprietatea lățimii (width) este setată la 100%, playerul video va răspunde și va scala în sus și în jos:
video {
width: 100%;
height: auto;
}
Rețineți că, playerul video poate fi amplificat pentru a fi mai mare decât dimensiunea inițială. O soluție mai bună, în multe cazuri, va fi utilizarea în schimb a proprietății cu lățimea maximă (max-width).Utilizarea proprietății lățime maximă (max-width)
Dacă proprietatea lățime maximă (max-width) este setată la 100%, playerul video va scădea în jos dacă trebuie, dar niciodată nu va fi mai mare decât dimensiunea inițială:
Exemplu:
video {
max-width: 100%;
height: auto;
}
Adăugați un videoclip la pagina web de exemplu
Vrem să adăugăm un videoclip în pagina noastră web de exemplu. Videoclipul va fi redimensionat pentru a ocupa întotdeauna tot spațiul disponibil:
Exemplu:
video {
width: 100%;
height: auto;
}