Bootstrap Ratio Shortcode
On this page
Donate
Please check out the tutorial to
start using Hugo modules.
The ratio shortcode is perfect for responsively handling video or slideshow embeds based on the width of the parent.
Usage
1{{< bs/ratio [size] >}}
2CONTENT HERE
3{{< /bs/ratio >}}
Parameters
| Position | Name | Type | Required | Default | Description |
|---|---|---|---|---|---|
#0 | - | string | - | 16x9 | The aspect ratio, 1x1, 4x3, 16x9, 21x9 and custom aspect ratios. |
Examples
Aspect Ratio 1x1
1{{< bs/ratio 1x1 >}}
2 {{< bilibili BV1iT411B7yH >}}
3{{< /bs/ratio >}}
Aspect Ratio 4x3
1{{< bs/ratio 4x3 >}}
2 {{< bilibili BV1iT411B7yH >}}
3{{< /bs/ratio >}}
Aspect Ratio 16x9
1{{< bs/ratio 16x9 >}}
2 {{< bilibili BV1iT411B7yH >}}
3{{< /bs/ratio >}}
Aspect Ratio 21x9
1{{< bs/ratio 21x9 >}}
2 {{< bilibili BV1iT411B7yH >}}
3{{< /bs/ratio >}}