Skip to content

Card

Default

カード
html
<div class="jumpu-card mb-4 px-4 py-3">カード</div>

Anchor

jumpu-card クラスは display プロパティを指定していません。つまり、どの HTML 要素を使用するかによって見た目が変化します。a 要素のカードを div 要素のカードと同じように表示したい場合は、block クラスを付与するなど、明示的に display プロパティを指定する必要があります。

html
<a href="#" class="jumpu-card mb-4 block px-4 py-3">リンクカード</a>

Shadowed

影付きカード
html
<div class="jumpu-card border-0 px-4 py-3 shadow-lg">影付きカード</div>