diff --git a/docs/components/card.md b/docs/components/card.md index b53d2e39ae..14db8f962b 100644 --- a/docs/components/card.md +++ b/docs/components/card.md @@ -51,6 +51,8 @@ Cards support a wide variety of content, including images, text, list groups, li {% endexample %} +Lists can be added to a card by adding a list group. + {% example html %}
{% endexample %} +`.card-img-top` places an image to the top of the card. With `.card-text`, text can be added to the card. Text within `.card-text` can also be styled with the standard HTML tags. + {% example html %}
Card image cap @@ -70,6 +74,8 @@ Cards support a wide variety of content, including images, text, list groups, li
{% endexample %} +Card titles are used by adding `.card-title` to a `` tag. In the same way, links are added and placed next to each other by adding `.card-link` to a `` tag. + {% example html %}

Card title

@@ -79,6 +85,10 @@ Cards support a wide variety of content, including images, text, list groups, li
{% endexample %} +Subtitles are used by adding a `.card-subtitle` to an `` tag. If the `.card-title` and the `.card-subtitle` items are placed in a `.card-block` item, the card title and subtitle are aligned nicely. + +The multiple content types can be easily combined to create the card you need. See below for an example. + {% example html %}
@@ -170,6 +180,8 @@ Add an optional header and/or footer within a card.
{% endexample %} +Card headers can be styled by adding `.card-header` to `` elements. + {% example html %}

Featured