Blog Card là thành phần hiển thị các bài viết của bạn trên trang blog của bạn. Nó bao gồm nhiều thành phần như ngày giờ tạo, tiêu đề, nội dung, hình ảnh minh họa, loại bài viết… Để tạo được một card blog đẹp chúng ta cần dựa vào rất nhiều yếu tố như. Đó là một bố cục rõ ràng, dễ hiểu, phân chia các thành phần hợp lý… Vì vậy, trong bài viết hôm nay chúng ta sẽ cùng xem những mẫu blog card đẹp trong thiết kế website năm
Thẻ blog của Flexbox CSSTác giả
- Aashir Aamir Khan
- 5 Tháng Năm, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thẻ McDonalds - TailwindCSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. theo chiều gió. css
Tác giả
- Madalena
- 26 Tháng Tư, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thẻ gấp tính năng ngày lễ
Một trang giao dịch kỳ nghỉ nhỏ tập trung vào chức năng và thiết kế thiệp gấp, chỉ sử dụng HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Jhey
- 15 Tháng Tư, 2020
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [Bút stylus]
Về một mã
Thẻ chống lại nhà phát triển Vol. 2
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Dan Benmore
- 9 Tháng Tư, 2020
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS
Về một mã
Gấp thẻ hoạt hình
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Markelrayes
- 27 Tháng Ba, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thẻ CSS thuần túy với các biểu tượng xã hội
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Reiha Hosseini
- 1 Tháng Ba, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS [Bút cảm ứng]
Về một mã
Thẻ Hover FX
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- người da đen
- 11 Tháng hai, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Phối cảnh thẻ CSS
Giới thiệu về hoạt ảnh CSS với thuộc tính chuyển tiếp. Đây là nơi niềm vui bắt đầu khi chơi một số thuộc tính CSS. Bất kỳ dự án phát triển giao diện người dùng nào của trang web mà bạn có, bạn luôn có những phần mà bạn muốn có bất kỳ hiệu ứng hoạt hình đẹp mắt nào. Thẻ Bootstrap 4
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. khởi động. css
Tác giả
- Ryan Mulligan
- 6 Tháng Hai, 2020
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [SCSS]
Về một mã
Tương tác di chuột qua thẻ
Kết hợp một giải pháp để hiển thị một phần của phần tử trong thẻ ở trạng thái mặc định, sắp xếp dòng tiêu đề của phần tử trên mỗi thẻ và sau đó tạo hoạt ảnh cho phần tử ở giữa phần tử gốc của nó
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Rémi Rucojevic
- Tháng Một 30, 2020
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
thẻ vé
Thẻ đánh dấu đơn giản và rõ ràng trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Zed Dash
- Tháng Một 7, 2020
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [SCSS]
Về một mã
Nút di chuột nhiều ô
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Charlotte Dann
- Tháng Một 3, 2020
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [Sass]
Về một mã
Bài báo
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- HJB
- 22 Tháng mười hai, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Thẻ CSS đơn giản
Đây là một thẻ đơn giản với bóng
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Florin pop
- 19 Tháng mười hai, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thiết kế giao diện người dùng thẻ khóa học
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Andrew Hawkes
- 22 Tháng Mười Một, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Hiệu ứng di chuột trên thẻ trò chơi lấy cảm hứng từ hơi nước
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Curtis Lee
- 24 Tháng Chín, 2019
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [SCSS]
Về một mã
Thẻ giao diện người dùng
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Adam Dipinto
- 19 Tháng Chín, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Di chuột qua thẻ xã hội
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Jhonier Riascos Zapata
- 15 Tháng Chín, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Hiệu ứng di chuột trên thẻ CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- mrnobody
- 24 Tháng Tám, 2019
liên kết
- bản demo và mã
- video youtube
Làm với
- HTML/CSS [SCSS]
Về một mã
Hiệu ứng khi di chuột trên thẻ sáng tạo CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Kaio Almeida
- 29 Tháng sáu, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Hiệu ứng di chuột trên thẻ với Cubic Bezier
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Steve Schoger
- 21 Tháng Năm, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Xem trước thẻ
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. theo chiều gió. css
Tác giả
- Steve Schoger
- 17 Tháng Năm, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thẻ dữ liệu
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. theo chiều gió. css
Tác giả
- Adam Kuhn
- 7 Tháng Năm, 2019
liên kết
- bản demo và mã
Làm với
- HTML [Haml] / CSS [SCSS]
Về một mã
Băng chuyền thẻ CSS thuần túy
Trình duyệt tương thích. Chrome, Edge, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Steve Meredith
- 5 Tháng Năm, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về một mã
Thẻ lọc CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Janne Leppänen
- 18 Tháng Ba, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về mã
Hoạt hình thẻ
Thẻ CSS đáp ứng với hình ảnh động
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Russ Pate
- 16 Tháng Năm, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Thẻ CSS Tailwind
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. theo chiều gió. css
Tác giả
- Tsumari
- 12 Tháng Ba, 2019
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [Sass]
Về mã
thẻ
Biến thể của thẻ trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Jon Yablonski
- 9 Tháng Ba, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về mã
Hoạt hình thẻ
Thẻ hoạt hình có tiêu đề và tiêu đề phụ trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Dannie Vinther
- 8 Tháng Ba, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Thẻ cắt 3D
Thẻ cắt CSS 3D thuần túy
Trình duyệt tương thích. Chrome, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. bootstrap-khởi động lại. css
Tác giả
- Bờm Abhishek
- 7 Tháng Ba, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
thẻ
Thẻ có box-shadow
và hiệu ứng di chuột trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Manoj Silag
- 14 Tháng hai, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Hiệu ứng lá bài
Hiệu ứng di chuột cho thẻ trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- phường Joshua
- 17 Tháng Một, 2019
liên kết
- bản demo và mã
Làm với
- HTML [Pug] / CSS [SCSS]
Về mã
Thẻ có hình với chú thích hình
Một với một thẻ HTML
. và. ngày mà tất cả. lơ lửng
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Alvaro Montoro
- Tháng Một 11, 2019
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Thẻ người chơi/người dùng
Thẻ người chơi/người dùng có hiệu ứng di chuột trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Andy chân trần
- 4 Tháng Mười Một, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Bố cục thương mại điện tử dạng lưới CSS
Bố cục thương mại điện tử lưới CSS chơi bài
Trình duyệt tương thích. Chrome, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Andy chân trần
- 3 Tháng Mười Một, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Thẻ thương mại điện tử bị lệch
Bố cục thẻ sản phẩm thương mại điện tử đáp ứng bằng CSS Grid
Trình duyệt tương thích. Chrome, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- đấu lại
- 16 Tháng mười, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về mã
Hồ sơ thẻ Cv
Một hồ sơ thẻ kỹ thuật số tiếp tục tất cả các bức tranh toàn cảnh chuyên nghiệp cần thiết của bạn và dễ dàng chia sẻ
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Yancy Min
- 8 tháng 10, 2018
liên kết
- bản demo và mã
- rê bóng
Làm với
- HTML/CSS [SCSS]
Về mã
Khái niệm thẻ thông tin
Khái niệm thẻ thông tin với thiết kế đẹp trong HTML và CSS
Trình duyệt tương thích. Chrome, Edge, Opera, Safari
Đáp ứng. không
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Sowmya Seshadri
- 12 Tháng Chín, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về mã
Chuyển đổi thẻ
Thẻ HTMl và CSS có hiệu ứng di chuột
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Sowmya Seshadri
- 10 Tháng Chín, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về mã
Thẻ sản phẩm CSS Hover
Mô tả mục khi di chuột qua thẻ
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. phông chữ tuyệt vời. css
Tác giả
- Mikael Ainalem
- 7 Tháng Tám, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Mở rộng/thu gọn thẻ với văn bản cắt hình
Mở rộng/thu gọn thẻ với cắt văn bản theo hình dạng của nhãn. Sử dụng CSS clip-path
để tạo hiệu ứng hiển thị trên văn bản ẩn sau nhãn cổ điển
Trình duyệt tương thích. Chrome, Firefox, Opera, Safari
Đáp ứng. có
Phụ thuộc. -
Tác giả
- Adam Kuhn
- 5 Tháng Sáu, 2018
liên kết
- bản demo và mã
Làm với
- HTML [Haml] / CSS [SCSS]
Về mã
Giao diện người dùng thẻ CSS thuần túy
Giao diện người dùng thẻ CSS thuần túy với hiệu ứng chuyển đổi gooey
Trình duyệt tương thích. Chrome, Edge, Firefox, Opera, Safari
Đáp ứng. không
Phụ thuộc. -
Tác giả
- Lâm Sướng
- 06 Tháng hai, 2018
liên kết
- bản demo và mã
Làm với
- HTML/CSS
Về mã
Hoạt hình thẻ
Hoạt hình thẻ với CSS, HTML và một số sự kiện di chuột
Tác giả
- Nico
- 28 Tháng Chín, 2017
liên kết
- bản demo và mã
Làm với
- HTML
- CSS/SCSS
Về mã
Chỉ dành cho bộ nhớ Polaroid CSS
Chỉ cần một số ký ức Polaroid sử dụng các thuộc tính, bộ lọc và chuyển tiếp tùy chỉnh css
Tác giả
- Trevor Eyre
- 23 Tháng Sáu, 2017
liên kết
- bản demo và mã
Làm với
- HTML/CSS [SCSS]
Về một mã
Lớp phủ thẻ kính mờ
Hiệu ứng kính mờ sử dụng thuộc tính bộ lọc CSS3. Tiêu đề và mô tả của thẻ trượt lên khi di chuột, làm mờ nền của thẻ phía sau chúng