Home » MẸO VẶT BLOGGER »
Sửa lỗi ảnh tràn ra ngoài khung bài đăng blogspot
Rất nhiều Blog gặp phải lỗi kích thước ảnh tràn ra ngoài phần hiển thị bài viết trong Blog, nguyên nhân là do phần bài đăng thì nhỏ mà ảnh thì quá rộng.Để giải quyết triệt để vấn đề này tương đối đơn giản (bằng dòng lệnh trong CSS) nhưng khá hiệu quả. Dòng lệnh này 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: (Ở bài này lấy ví dụ với chiều rộng của phần bài viết là 500px.)
Bắt đầu nào:
Bước 1. Truy cập vào Blogger rồi chọn Thiết kế --> Chỉnh sửa HTML
Bước 2. Bạn hãy đặt trước dòng ]]></b:skin> đoạn code sau:
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 >> Layout >>Edit/Html và chỉnh sửa chúng.
Bắt đầu nào:
Bước 1. Truy cập vào Blogger rồi chọn Thiết kế --> Chỉnh sửa HTML
Bước 2. Bạn hãy đặt trước dòng ]]></b:skin> đoạn code sau:
.post img { max-width:500px; min-width:200px; padding : 10px; clear: both; }
Sau khi áp dụng cái này 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.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à 500 x 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 >> Layout >>Edit/Html và chỉnh sửa chúng.
Nguồn: vnblognet
Posted in
MẸO VẶT BLOGGER
Bài viết liên quan
Nếu bạn thích bài này thì hãy điền email để nhận bài đăng mới.
BÀI ĐĂNG NỔI BẬT
-
Hướng dẫn nuôi cá rồng - Arowana Theo văn hóa Trung Quốc, nuôi cá rồng đỏ trong nhà sẽ mang lại sự may mắn và thịnh vượng, chính vì thế m...
-
Nhiều người dùng vì ham rẻ mà mua nhầm iPhone 4 nhái . Loạt ảnh dưới đây giúp bạn so sánh iPhone 4 thật và giả. Hộp đựng điện thoại iPhone...
-
Đây là website chính thức do mr.Đông phát hiện ra http://www.pearsonlongman.com/newcuttingedge/ New Cutting Edge Elementary Student...
Bình luận
Nhãn
AFRICA
(1)
CÔNG NGHỆ
(15)
HỌC TIẾNG ANH
(11)
karaoke
(7)
kế toán
(1)
KINH DOANH
(2)
KỸ NĂNG
(6)
m
(3)
MẸO CHỮA BỆNH
(14)
MẸO VẶT BLOGGER
(100)
MẸO VẶT GIA ĐÌNH
(5)
MẸO VẶT GIAO TIẾP
(12)
MẸO VẶT HỌC HÀNH
(10)
MẸO VẶT KINH DOANH
(30)
MẸO VẶT LÀM ĐẸP
(57)
MẸO VẶT MÁY TÍNH
(49)
MẸO VẶT NẤU NGON
(41)
MẸO VẶT THÀNH CÔNG
(1)
MẸO VẶT TỔNG HỢP
(39)
PHẦN MỀM
(64)
Sức khỏe bà bầu
(6)
TEMPLATE
(72)
THỜI TRANG
(1)
THỦ THUẬT
(14)
TIN TỨC
(224)
TÌNH YÊU-GIỚI TÍNH
(7)
tiq
(1)
VIDEO HÀI
(1)
windows
(3)
Xem phim
(1)
0 nhận xét cho bài đăng này
Hãy để lại nhận xét nếu bạn thích bài đăng này