Cách reponsive hình ảnh trong blogger
Responsive là gì?
Hiểu một cách đơn giản web responsive là phong cách thiết kế website làm sao cho phù hợp trên tất cả các thiết bị, mọi độ phân giải màn hình. Một website đẹp trên máy tính nhưng khi xem trên điện thoại bố cục lộn xộn, hình ảnh, bài viết không cân đối thì không thể gọi là web responsive
Ví dụ về web responsive: Bạn mở trang chủ website responsive, rồi thu nhỏ trình duyệt hoặc đổi độ phân giải màn hình, bạn sẽ thấy website của mình không hề xuất hiện Scrollbar ngang, mà nó sẽ tự động co dãn sao cho phù hợp với chiều rộng màn hình máy tính bạn.
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
Hình ảnh Reponsive trong blogger??
Vậy đối với blogger của bạn như thế nào?.. Thực sự có nhiều mẫu blogspot đẹp nó đã được responsive rồi nhưng các bạn thường thấy khi viết bài các hình ảnh bạn chèn vào nó không được như ý. Nhìn rất không hợp với các màn hình khác nhau. Nó chỉ đẹp ở desktop vậy bạn nên điều chỉnh nó mà không liên quan đến phần nào của trang bạn đang có.Để áp dụng code vào trong blogger bạn vui lòng làm theo các bước như hình bên dưới: Vào Blogger Dashboard > Template (Chủ đề)> Edit HTML (Chỉnh sửa HTML). Thêm đoạn css dưới đây vào trên thẻ ]]</b:skin>
.separator a{margin-left:0px !important;margin-right:0px !important;}
.post img{max-width:100%;height:auto;}Tùy vào từng mẫu khác nhau để thẻ img nó sẽ lồng khác nhau. Vì vậy khi thêm đoạn code trên mà vẫn không được các bạn nên tìm hiểu thẻ img nằm trong vùng nào nhé.
Sau đó lưu lại mẫu và xem kết quả trên điện thoại hoặc trên trình duyệt click chuột phải chọn [Kiểm tra].