Tự động co hình ảnh cho vừa với chiều rộng của trang

Nếu bạn chèn một hình quá lớn vào trang có khung trung bình thì tình trạng bì tràn ra khỏi khung của trang sẽ làm mất đi vẻ thẫm mỹ. Bài viết sẽ hướng dẫn bạn cách tự động co chiều rộng của hình sao cho vừa với trang nhất.

Bài viết tham khảo từ trang HelpBlogger và có nói thêm một số ý. Chỉ dùng CSS nên tốc độ load trang sẽ không bị ảnh hưởng.

Bạn có biết blogger cũng có sẵn chế độ tự co hình?

Mỗi khi bạn upload một hình trong bài viết thì khi nhấn vào hình ấy, bạn sẽ thấy giống như hình dưới

Tuy nhiên theo như các tuỳ chọn có sẵn “Nhỏ – Trung bình – Lớn – Rất Lớn” thì mỗi cái đều có một kích thước cụ thể, khi ấy có thể kích thước ấy không phù hợp với trang của bạn. Ví dụ, cái Lớn có kích thước là 400px (ví dụ thôi chứ không phải số này), trong khi trang bạn là 500px, suy ra còn 100px sẽ bị dư ra trông hơi xấu. 

Bạn muốn hình vừa khít chiều rộng trang luôn thì làm sao? Bạn sẽ chọn “Kích thước ban đầu“? Không! Chọn cái này nó sẽ giữ nguyên kích thước của hình cho bạn, ví dụ hình bạn up lên có kích thước 900px thì nó vẫn giữ y như thế trong khi trang của bạn rộng tối đa có 500px thôi, khi ấy hình sẽ bị lấn ra ngoài tới hơn phân nửa. Trang cũng sẽ bị méo theo!

Bài viết này là lựa chọn tối ưu nếu bạn muốn thoải mái up hình mà vẫn có được chiều rộng hình ĐÚNG BẰNG chiều rộng trang.

Cách làm

Điều cần lưu ý, sau khi bạn làm thủ thuật này, tất cả các hình trong quá khứ nếu bạn để chế độ “Kích thước ban đầu” sẽ bị ảnh hưởng theo.

Bước 1. Tìm đến dòn code sau

Bước 2. Dán vào TRƯỚC nó đoạn code sau

Bước 3. Cách dùng. Sau mỗi lần upload hình lên, bạn chọn “Kích thước ban đầu“.

Đoạn code ở Bước 2 chỉ có tác dụng cho những ảnh bạn đã chọn “Kích thước ban đầu”, nếu bạn chọn những cái khác ví dụ như “Lớn” hay “Trung bình” thì đoạn code không có tác dụng. Thay vào đó, bạn vẫn muốn thay đổi cả những hình mà khi trước bạn đã chọn “Lớn” hay “Trung bình” này thì ở Bước 2 dùng đoạn code sau đây

Hãy cẩn trọng vì nếu có vài bài viết mà hình trong đó bạn để float trái hay phải thì nó cũng sẽ tự động được tăng kích thước lên 100%.

Đinh Anh Thi

Đinh Anh Thi

Sáng lập Math2IT. Hiện Thi đang là nghiên cứu sinh tại Pháp về chuyên ngành Toán Ứng Dụng. Anh mong muốn tổng hợp và chia sẻ kiến thức Toán thực tế, Khoa học ứng dụng và Tin học thường thức đến tất cả mọi người dưới dạng dễ tiếp cận và tự nhiên nhất.