Browser docs

Bootstrap Ratio Shortcode

Hugo Modules Authors April 1, 2023 1 min read Shortcode Docs Bootstrap Ratio
On this page

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

PositionNameTypeRequiredDefaultDescription
#0-string-16x9The 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 >}}