Giới hạn chiều rộng hình ảnh trong bài viết Blogger

October 15, 2013
Giới hạn chiều rộng hình ảnh Blogger/BlogspotBạn Ngọc từ địa chỉ email sakura1502..@gmail.com có hỏi: "Chào bạn, Mình có blog dùng để lưu trữ hình ảnh do mình tự chụp được, thường hình ảnh của mình rất lớn nên khi đưa lên blog hay bị vỡ khung (hình ảnh lấn sang sidebar). Mặc dù blog có sẵn chức năng tùy chỉnh kích thước: nhỏ, trung bình, lớn, rất lớn, nhưng những kích thước này nhỏ thì nhỏ quá, mà lớn thì lại lớn quá nên mình không dùng. Mình muốn khi up lên hình ảnh sẽ hiển thị kích thước ban đầu nhưng lúc xem thì sẽ giới hạn chiều rộng hình ảnh để không bị lấn sang sidebar, bạn biết làm hướng dẫn mình nhé. Cảm ơn bạn!!!"
Cám ơn Ngọc đã gửi câu hỏi đến DoPhuQuy's Blog, dưới đây là phần trả lời cho câu hỏi của bạn.
Để giới hạn kích thước chiều rộng hình ảnh trong bài viết (tất nhiên khi đó chiều cao cũng sẽ giảm xuống tỉ lệ với chiều rộng) bạn làm như sau:
- Vào mục Mẫu, chọn tiếp Chỉnh sửa HTML
- Chèn đoạn mã dưới đây vào ngay trước ]]></b:skin>
.post img{max-width:550px;}
- Bấm Lưu mẫu để hoàn thành.
Với 550 là giới hạn kích thước chiều rộng của hình ảnh hiển thị trong bài viết, nghĩa là: Những hình ảnh có chiều rộng lớn hơn 550px sẽ tự động thu nhỏ xuống còn 550px, những hình ảnh có kích thước chiều rộng 550px trở lại thì giữ nguyên kích thước. Bạn có thể thay đổi 550 thành giá trị khác!.
Đã có 3 lời bình luận cho chủ đề Giới hạn chiều rộng hình ảnh trong bài viết Blogger. Trang web dophuquy.com rất hoan nghênh đón nhận những lời bình luận mang tính xây dựng từ độc giả.
  1. Nghia Le Đơn giản nhỉ
    Nhưng không xem chắc mình cũng không biết đâu
    hihi
  2. Blog Sức Khỏe Hoặc cũng có thể thay bằng giá trị tương đối %
    .post img{max-width:95%;}
  3. Nam Le Hay quá, mình làm được rồi. Rất gọn gàng sạch sẽ

 
Di chuyển lên trên cùng



Bình luận bài viết