Коллекция бесплатных примеров шаблонов HTML и CSS Blog Cards. Отобрано вручную с сайта codepen.io. Компонент карточки блога является одним из основных компонентов любого блога, поскольку он должен отображать некоторые данные, такие как заголовок, дата публикации, описание и изображение функции, чтобы читатели могли легко читать их, поэтому вот 26 блогов CSS. шаблоны карточек, вы можете их использовать.
Оригинальная статья, опубликованная на Frontend Solutions — 26 CSS Blog Cards
1. Дизайн карточки блога
Сделано с помощью: HTML (мопс) / CSS (SCSS)
Создано Джошуа, создано 13 июля 2020 г.
Ответ: нет
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
2. Карточка блога
Сделано с помощью: HTML/CSS
Автор Баттал Шахин, создан 9 января 2022 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
3. Слайдер карты блога
Сделано с помощью: HTML/CSS (SCSS)/JS
Автор vin wu, создано 11 мая 2020 г.
Отзывчиво: да
Зависимости: Google Fonts, swiper.css, swiper.js, jQuery.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
4. Анимация прозрачного текста карточки блога
Сделано с использованием: HTML (мопс)/CSS (меньше)
Создано Daiquiri.io, создано 1 марта 2017 г.
Ответ: нет
Зависимости: Google Fonts, icomoon.css, bootstrap.css, jQuery.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
5. Дизайн карточки блога
Сделано с помощью: Html/CSS/JS
Автор Robin Garbe, создано 1 сентября 2018 г.
Ответ: нет
Зависимости: Google Fonts, clamp.js
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
6. Карточка блога (Sass & Pug)
Сделано с использованием: HTML (Pug)/CSS (Sass)
Создано IMarty, создано 12 января 2016 г.
Ответ: нет
Зависимости: Google Fonts, Font-Awesome.css
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
7. Макет карты сообщений в блоге
Сделано с помощью: HTML/CSS
Создано Booligoosh, создано 5 июня 2018 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
8. Сообщение в блоге
Сделано с помощью: HTML/CSS
Создано Nodws, создано 25 сентября 2016 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
9. CSS-карта
Сделано с помощью: HTML/CSS
Автор markelrayes, создано 27 марта 2020 г.
Ответ: нет
Зависимости: -
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
10. Карточка CSS
Сделано с помощью: Html/CSS (SCSS)
Автор Дэмиен Фландрин, создано 17 февраля 2017 г.
Ответ: нет
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
11. Отзывчивая карточка CSS
Сделано с помощью: HTML/CSS
Создано Самиром Мунджеваром, создано 20 ноября 2018 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
12. Карточка блога CSS
Сделано с помощью: Html/CSS
Автор themodrnhakr, создан 14 января 2022 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
13. Карты фильтров CSS
Сделано с помощью: Html/CSS
Автор Стив Мередит, создан 5 мая 2019 г.
Отзывчиво: да
Зависимости: Google Fonts
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari.
