Duyarlı Web Tasarımı - Videolar
Genişlik Özelliğini Kullanma
Özellik %100 olarak width
ayarlanırsa video oynatıcı yanıt verir ve yukarı ve aşağı ölçeklenir:
Örnek
video {
width: 100%;
height: auto;
}
Yukarıdaki örnekte, video oynatıcının orijinal boyutundan daha büyük olacak şekilde büyütülebileceğine dikkat edin. Çoğu durumda
max-width
bunun yerine özelliği kullanmak daha iyi bir çözüm olacaktır.
max-width Özelliğini Kullanma
Özellik %100'e ayarlanırsa , max-width
video oynatıcı gerektiğinde küçülür, ancak asla orijinal boyutundan daha büyük olmayacak şekilde ölçeklenir:
Örnek
video {
max-width: 100%;
height: auto;
}
Örnek Web Sayfasına Video Ekleme
Örnek web sayfamıza bir video eklemek istiyoruz. Video, her zaman tüm kullanılabilir alanı kaplayacak şekilde yeniden boyutlandırılacaktır:
Örnek
video {
width: 100%;
height: auto;
}