एम्बेड करदा ऐ

कुसै बी डिवाइस पर स्केल करने आह् ले इक आंतरिक अनुपात बनाइयै माता-पिता दी चौड़ाई दे आधार उप्पर प्रतिक्रियाशील वीडियो जां स्लाइड शो एम्बेड बनाओ।

तकरीबन

नियम सीधे तौर पर <iframe>, <embed>, <video>, ते <object>तत्वें पर लागू कीते जंदे न; वैकल्पिक रूप कन्नै इक स्पष्ट वंशज वर्ग दा इस्तेमाल करो .embed-responsive-itemजिसलै तुस होर गुणें आस्तै स्टाइलिंग कन्नै मेल खंदा ऐ.

प्रो-टिप ऐ ! frameborder="0"तुसेंगी अपने s च शामल करने दी लोड़ नेईं ऐ <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;