Как сверстать такую карточку?
Дополнительно:
как, как, используя css, тут же вооооообще самый базовый уровень, почитайте хоть что то для начала
Получается такое, как можно логотип человека закинуть в конец строки перед цифрой 2?
HTML: .header .title .icon .counter CSS: .header { display: flex; } .title { flex-grow: 1; // or margin-right: auto; } |
HTML: .header .title .icon .counter CSS: .header { display: flex; } .title { flex-grow: 1; // or margin-right: auto; }
Вроде так: https://codepen.io/nurkanaat/pen/oNmNmyq
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для создания карточки на веб-странице можно воспользоваться HTML и CSS. Вот пример кода, который поможет вам сверстать карточку:
```html
.card {
border: 1px solid #ccc;
border-radius: 5px;
padding: 10px;
width: 300px;
margin: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.card img {
width: 100%;
border-radius: 5px 5px 0 0;
}
.card-content {
padding: 10px;
}
.card-title {
font-size: 20px;
font-weight: bold;
}
.card-description {
color: #666;
}
.button {
background-color: #007bff;
color: #fff;
padding: 5px 10px;
border: none;
border-radius: 3px;
cursor: pointer;
}
Название карточки
Описание карточки
```
Этот код создаст карточку с изображением, названием, описанием и кнопкой "Подробнее". Вы можете настроить стили под свои нужды, изменяя размеры, цвета и шрифты.
Не забудьте заменить "image.jpg" на путь к вашему изображению. Оптимально использовать изображение с соотношением сторон 16:9 для лучшего визуального эффекта.