បង្កប់
បង្កើតការបង្កប់វីដេអូ ឬការបញ្ចាំងស្លាយដែលឆ្លើយតបដោយផ្អែកលើទទឹងរបស់មេ ដោយបង្កើតសមាមាត្រខាងក្នុងដែលធ្វើមាត្រដ្ឋានលើឧបករណ៍ណាមួយ។
អំពី
ច្បាប់ត្រូវបានអនុវត្តដោយផ្ទាល់ទៅ <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;