Ҷойгиркунӣ
Дар асоси паҳнои волидайн тавассути эҷоди таносуби дохилие, ки дар ҳама гуна дастгоҳ миқёс дорад, видео ё слайд-шоуҳои ҷавобгӯ эҷод кунед.
Дар бораи
Қоидаҳо бевосита ба <iframe>
, <embed>
, <video>
, ва <object>
унсурҳо татбиқ мешаванд; ба таври ихтиёрӣ синфи насли возеҳро истифода баред, .embed-responsive-item
вақте ки шумо мехоҳед услубро барои атрибутҳои дигар мувофиқ кунед.
Pro-Tip! Ба шумо лозим нест, ки ба с-и худ дохил frameborder="0"
кунед <iframe>
, зеро мо онро барои шумо бекор мекунем.
Мисол
<iframe>
Ҳама гуна ҷойгиркуниро ба мисли унсури волидайн бо .embed-responsive
таносуби ҷанбаҳо печонед . Ин .embed-responsive-item
ба таври қатъӣ талаб карда намешавад, аммо мо онро ташвиқ мекунем.
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/zpOULjyy-n8?rel=0" allowfullscreen></iframe>
</div>
Таносуби тарафҳо
Таносуби тарафҳоро бо синфҳои тағирдиҳанда танзим кардан мумкин аст. Бо нобаёнӣ синфҳои зерини таносуб пешбинӣ шудаанд:
<!-- 21:9 aspect ratio -->
<div class="embed-responsive embed-responsive-21by9">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
<!-- 1:1 aspect ratio -->
<div class="embed-responsive embed-responsive-1by1">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
Дар дохили _variables.scss
, шумо метавонед таносуби ҷанбаҳоеро, ки мехоҳед истифода баред, тағир диҳед. Ин аст як мисоли $embed-responsive-aspect-ratios
рӯйхат:
$embed-responsive-aspect-ratios: (
(21 9),
(16 9),
(4 3),
(1 1)
) !default;