Thủ thuật sử lổi ảnh tràn ra khung của blogger

thủ thuật làm co lại ảnh cứ mỗi lần đăng ảnh rộng quá làm tràn ra khung blogger

Xin chào các bạn hôm nay PhucNguyenIT sẽ hướng dẫn mọi người sử dụng blogger nói chung và tất cả các webmaster cách chống tràn ảnh ra khung của blogger ..

- Có khi nào anh em đăng 1 tấm ảnh nào đó lên blogger mà khi chúng ta muốn nó có kich thước lớn nhưng lại bị tràn ra khung  ( ví dụ như hình ảnh bên dưới )

- khi chúng ta cho nhỏ lại thì nội dung lại bị tràn ra..

thật ức chế đúng không =))

fix lỗi ảnh tràn khung blooger

- Vậy hôm nay chỉ cần 1 đoạn code sau anh em có thể yên tâm đăng các hình ảnh lớn mà không lo bị tràn ra khung..

Để chúng tự động điều chỉnh hiển thị phù hợp với phần nội dung bài viết các bạn làm như sau: (Ví dụ với chiều rộng của phần bài viết (Post section) là 500px.) 

1- Đăng nhập (login) vào Blog
2- Vào Mẫu (Template)
3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed):

4 - Điều chỉnh kích thước min và MAX của ảnh hiển thị trong Blogger:

Để cố định hình ảnh hiển thị trong blogger, với hình ảnh  to hơn giá trị MAX thì sẽ tự động điều chỉnh về giá trị MAX, nếu ảnh nhỏ hơn giá trị min thì sẽ tự điều chỉnh về kích thước min, bạn đặt trước ]]></b:skin> đoạn mã sau:

.post img {      
max-width:500px;       
min-width:200px;       
padding : 10px;       
clear: both;       
}

 Điều chỉnh lại max-with và min-with cho phù hợp với phần bài đăng của bạn nha.
Nếu bạn muốn tất cả các hình ảnh hiển thị trong phần bài viết có kích thước cố định là 500px 400 thì bạn chỉ cần thay thế đoạn code đã hướng dẫn ở trên bằng:

.post img {      
width:500px;       
height:400px;       
padding:10px;       
}

Giờ đây các hình ảnh hiển thị trên Blog của bạn có kích thước cố định là chiều rộng 500PX và chiều cao 400PX.

Lưu ý: Nếu hình ảnh hiển thị không như ý hoặc không chính xác thì bạn tìm tag .post img trong Blogger >> Mẫu (Template) >> Chỉnh sửa HTML (Edit/Html) và chỉnh sửa chúng.

 Từ khóa nội dung : Thủ thuật,thủ thuật blogspot,thủ thuật fix lỗi tràn khung