mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-05 16:42:29 +03:00
@@ -1,7 +1,7 @@
|
||||
---
|
||||
layout: docs
|
||||
title: Cards
|
||||
description: Bootstrap Cards provide a flexible and extensible content container with multiple variants and options.
|
||||
description: Bootstrap's cards provide a flexible and extensible content container with multiple variants and options.
|
||||
group: components
|
||||
---
|
||||
|
||||
@@ -18,7 +18,7 @@ If you're familiar with Bootstrap 3, cards replace our old panels, wells, and th
|
||||
|
||||
Cards are built with as little markup and styles as possible, but still manage to deliver a ton of control and customization. Built with flexbox, they offer easy alignment and mix well with other Bootstrap components.
|
||||
|
||||
Below is an example of a basic card with mixed content and a fixed width. Cards have no fixed width to start, so they'll naturally fill the full width of it's parent element. This is easily customized with our various [sizing options](#sizing).
|
||||
Below is an example of a basic card with mixed content and a fixed width. Cards have no fixed width to start, so they'll naturally fill the full width of its parent element. This is easily customized with our various [sizing options](#sizing).
|
||||
|
||||
{% example html %}
|
||||
<div class="card" style="width: 20rem;">
|
||||
@@ -51,7 +51,7 @@ The building block of a card is the `.card-block`. Use it whenever you need a pa
|
||||
|
||||
Card titles are used by adding `.card-title` to a `<h*>` tag. In the same way, links are added and placed next to each other by adding `.card-link` to a `<a>` tag.
|
||||
|
||||
Subtitles are used by adding a `.card-subtitle` to an `<h*>` 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.
|
||||
Subtitles are used by adding a `.card-subtitle` to a `<h*>` 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.
|
||||
|
||||
{% example html %}
|
||||
<div class="card">
|
||||
|
||||
Reference in New Issue
Block a user