Source

ଏମ୍ବେଡ୍ କରନ୍ତୁ |

ପିତାମାତାଙ୍କ ମୋଟେଇ ଉପରେ ଆଧାର କରି ପ୍ରତିକ୍ରିୟାଶୀଳ ଭିଡିଓ କିମ୍ବା ସ୍ଲାଇଡ୍ ଶୋ ଏମ୍ବେଡ୍ ସୃଷ୍ଟି କରନ୍ତୁ, ଯେକ any ଣସି ଉପକରଣରେ ମାପକାଠି କରୁଥିବା ଏକ ଅନ୍ତର୍ନିହିତ ଅନୁପାତ ସୃଷ୍ଟି କରି |

ବିଷୟରେ

ନିୟମ ସିଧାସଳଖ <iframe>,, ଏବଂ ଉପାଦାନଗୁଡ଼ିକ <embed>ପାଇଁ ପ୍ରୟୋଗ କରାଯାଏ; ବ other କଳ୍ପିକ ଭାବରେ ଏକ ସ୍ପଷ୍ଟ ବଂଶଧର ଶ୍ରେଣୀ ବ୍ୟବହାର କର ଯେତେବେଳେ ତୁମେ ଅନ୍ୟ ଗୁଣ ପାଇଁ ଷ୍ଟାଇଲିଂ ସହିତ ମେଳ କରିବାକୁ ଚାହୁଁଛ |<video><object>.embed-responsive-item

ପ୍ରୋ-ଟିପ୍! frameborder="0"ଆମେ ତୁମ ପାଇଁ ଏହାକୁ ଅନ୍ତର୍ଭୂକ୍ତ କରିବା ଆବଶ୍ୟକ ନାହିଁ <iframe>ଯେହେତୁ ଆମେ ତୁମ ପାଇଁ ତାହା ନବଲିଖନ କରୁ |

ଉଦାହରଣ |

<iframe>ଏକ ପ୍ୟାରେଣ୍ଟ୍ ଉପାଦାନରେ .embed-responsiveଏବଂ ଏକ ଅନୁପାତ ଅନୁପାତରେ ଯେକ any ଣସି ଏମ୍ବେଡ୍ ଗୁଡ଼ାଇ ରଖନ୍ତୁ | ଏହା .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;