Embed

Ƙirƙirar bidiyo mai amsawa ko nunin faifai na nunin faifai dangane da faɗin iyaye ta hanyar ƙirƙira ma'auni mai ma'auni akan kowace na'ura.

Game da

Ana amfani da dokoki kai tsaye zuwa <iframe>, <embed>, <video>, da <object>abubuwa; na zaɓi yi amfani da ajin zuriya bayyananne .embed-responsive-itemlokacin da kake son daidaita salo don wasu halaye.

Pro-Tip! Ba kwa buƙatar haɗawa frameborder="0"a cikin <iframe>s ɗin ku yayin da muka soke muku hakan.

Misali

Kunna duk wani abin da aka haɗa kamar <iframe>a cikin kashi na iyaye tare .embed-responsiveda ma'aunin yanayin. Ba .embed-responsive-itema buƙata sosai ba, amma muna ƙarfafa shi.

<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>

Matsakaicin yanayin

Za a iya keɓance ma'auni na al'amari tare da azuzuwan masu gyara. Ta tsohuwa ana ba da azuzuwan rabo masu zuwa:

<!-- 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>

A ciki _variables.scss, zaku iya canza yanayin yanayin da kuke son amfani da shi. Ga misalin $embed-responsive-aspect-ratioslissafin:

$embed-responsive-aspect-ratios: (
  (21 9),
  (16 9),
  (4 3),
  (1 1)
) !default;