Share CODE CSS Giúp Tạo Hình Ảnh Reponsive Trong Blogspot

Share CODE CSS Giúp Tạo Hình Ảnh Reponsive Trong Blogspot

12:01
Reponsive tức là hiển thị phù hợp nhất theo trình duyệt. Ví dụ như bạn có 1 hình ảnh rất lớn thì hiển thị ở pc nó to ra còn ở mobile thì nó nhỏ vừa với màn hình mobile nhưng vẫn giữ nguyên kích thước. Nôm na là vậy các bạn có thể xem ở demo hình bên dưới sẽ hiểu hơn công dụng của nó. Chủ yếu là để tương thích với nhiều thiết bị hơn mà không phải tác động nhiều
Responsive là công nghệ mới mà hiện nay hầu như mọi trang web đang áp dụng, công nghệ responsive tương thích với mọi loại màn hình hiển thị giúp cho website thân thiện hơn với người dùng và bài viết này sẻ hướng dẫn cách để hình ảnh hiển thị responsive cho website và blogspot


Css giúp hình ảnh tương thích với nhiều thiết bị


Ở đây mình chỉ áp dụng với blogspot nhưng các bạn có thể áp dụng rộng hơn với mọi thành phần hình ảnh trong website. Đối với blogspot

1. Vào Blogger Dashboard > Template > Edit HTML.
2. Thêm đoạn css dưới đây và thẻ]]></b:skin> 
.separator a{margin-left:0px !important;margin-right:0px !important;}
.post img{max-width:100%;height:auto;}

Sau đó lưu mẫu lại và xem kết quả. Nếu có gì không hiểu vui lòng comment bên dưới để được hỗ trợ
Nguồn: tips24h và Niệm Style Blog
LABEL : #

Related Post

84 Nhận xét

avatar
Thứ Ba, tháng 4 03, 2018 8:48:00 CH

Đù moá hay quá anh ơi
Từ trước đến h cứ để ảnh vừa trên PC thì lên đt cứ dài ra
Nay có cái này thì ngon quá
Mai lên PC làm liền :))

avatar
Thứ Ba, tháng 4 03, 2018 8:52:00 CH

test thử rồi cho anh biết kết quả vs nhé

avatar
Thứ Ba, tháng 4 03, 2018 9:18:00 CH

ừ cảm ơn em để anh sửa lại

avatar
Thứ Năm, tháng 4 05, 2018 9:34:00 SA

Ủa thật hả anh. để em ghi nguồn

avatar
Thứ Năm, tháng 4 05, 2018 9:47:00 SA

Đúng roài, bên Niệm đăng nhưng css ngắn gọn hơn,e có thể bổ xung lại :)

avatar
Thứ Năm, tháng 4 05, 2018 10:56:00 SA

Lấu lắm mới thấy bài thủ Thuật Blogspot :))

avatar
Thứ Năm, tháng 4 05, 2018 4:49:00 CH

Để em thử :) nghe cos vẻ hay :)

avatar
Thứ Hai, tháng 4 16, 2018 5:01:00 CH

Hihi có gì qua blog tui ghé xem bài viết nhé

avatar
Thứ Tư, tháng 4 18, 2018 2:01:00 CH

Lỗi rồi ông rảnh không tui mail nói chuyện tý

avatar
Chủ Nhật, tháng 8 12, 2018 9:33:00 CH

em chờ mãi nó mới hiện ô comment xong quên luôn là muốn comment gì rồi :(

avatar
Thứ Ba, tháng 8 14, 2018 11:37:00 SA

tự tương thích ở các thiết bị à anh?

avatar
Thứ Ba, tháng 8 14, 2018 12:44:00 CH

Thay lại domain giúp e nhé :v https://www.tinhgetterblog.ooo/

avatar
Thứ Tư, tháng 8 15, 2018 10:13:00 SA

Lâu k thấy bác qua blog e chém gió nhỉ :v

avatar
Thứ Tư, tháng 8 15, 2018 1:09:00 CH

laptop em bị lỗi nên em chưa tương tác đc bác thông cảm

avatar
Thứ Bảy, tháng 8 18, 2018 7:04:00 SA

Đã thay temp đó từ quá lâu r nên ko nhớ kq a ạ =))

avatar
Thứ Bảy, tháng 8 18, 2018 8:57:00 SA

Em đã test từ trước rồi, nên cũng cảm thấy hài lòng, em thì không có nhận xét gì đâu, em cảm thấy rất hài lòng.

avatar
Thứ Bảy, tháng 8 18, 2018 10:16:00 SA

wow cái này rất hữu ích đúng cái em đang cần cho temp kia :)

avatar
Thứ Tư, tháng 8 22, 2018 4:54:00 CH

Nhờ cái này mà temp e hoàn thiện hơn