Мои требования
- Мне нужно сделать карту bootstrap небольшого размера, чтобы она точно соответствовала моей странице.
- удалить большую часть отступов, полей вокруг карточки, текста, значка ... То есть, он должен быть как можно меньшим, чтобы помещать 8 (одинакового размера) таких карточек в ряд, чтобы все параметры точно помещались в просмотр одной страницы вместе с двумя диаграммами, показанными выше, как показано на скриншоте ниже.
Приведенный ниже код в Bootstrap дает мне карту, как показано на этом рисунке. Я пытаюсь сделать ту же карту, своего рода копию карты, но небольшого размера.
<div class=" col-lg-3 col-md-6">
<div class=" card card-stats">
<div class=" card-body">
<div class=" row">
<div class=" col-5">
<div class=" info-icon text-center icon-primary">
<i class=" icons icon-shape-star"> </i>
</div>
</div>
<div class=" col-7">
<div class=" numbers">
<p class=" card-category">Followers</p>
<h3 class=" card-title">+45k</h3>
</div>
</div>
</div>
</div>
<div class=" card-footer">
<hr />
<div class=" stats">
<i class=" icons icon-sound-wave"> </i> Last Research
</div>
</div>
</div>
</div>
То, что я пытался Я пытался изменить элемент bootstrap * CSS col
number (col-1, col-5 ..), удалите отступы для элемента CSS card,card-body, ... , info-icon
, чтобы сделать иконку относительно маленькой, но это не дает мне его реплики с текстом, иконкой. Это всегда заканчивалось испорченной картой.
Пожалуйста, помогите мне. Моя конечная цель - сделать ее меньше и включить в карту дополнительные данные (4 параметра), которые должны выглядеть примерно так:
То есть
- значок в левом верхнем углу
- Первые данные в правом верхнем углу
- Вторые данные над нижним колонтитулом карты под значком
- Третий правый угол третьих данных, выровненный по правому краю со вторыми данными № 3, упомянутыми выше
- Четвертые данные в нижнем колонтитуле.
Также, если у вас есть какие-либо другие полезные идеи по включению данных 4 параметров в одну карту, поделитесь ими со мной. Это я делаю, чтобы соответствовать всем параметрам в пределах одного просмотра страницы.