Mẹo nhanh - Tối đa chiều rộng ảnh tránh đè lên sidebar của blog


Mình đã tham khảo rất nhiều Blog và thấy rằng ảnh chèn trong bài viết do kích thước quá lớn đã bị chồng chéo lên cạnh của sidebar. Mình thấy rằng để khắc phục điều này thật sự rất dễ dàng và chỉ mất một phút để thực hiện vậy tại sao chúng ta không áp dụng để blog đẹp hơn? Chỉ cần thêm một đoạn Css để làm cho hình ảnh có chiều rộng tối đa là 98% chiều rộng của bài viết.


Cách Thực Hiện

Bước 1: Vào Blogger > Mẫu > Tùy Chỉnh > Nâng Cao > Thêm CSS
Bước 2: Dán code bên dưới vào khung CSS sau đó click Áp dụng cho blog
.post img {max-width:98% !important}
Quá đơn giản phải không nào? Tuy nhiên lợi ích của nó thì không đơn giản chút nào đâu :d
8 Comments
Comments

8 comments

mình thấy thủ thuật này rất hay bạn có thể phổ biến cho anh em blogger Việt không? Nếu được thuật lại thành một bài đăng thì rất hay !

Wget: Bài phổ biến !
http://nncom.blogspot.com/2012/12/advanced-systemcare-pro-608182-final.html
25/12/12
Mình không hiểu ý bạn @-)
Bạn muốn mình chia sẻ thủ thuật gì vậy? :-?
Anonymous
26/12/12
y no la lay thu thuat cua muc Wget: Bài phổ biến ! o blog no dua link len do =p~
23/2/13
Chào bạn !!!Thủ thuật nhỏ này quá là hay .Nhưng sao mình thực hiện kg thành công bạn à!! mình đã làm ở 3 blog khác nhau nhưng không được ,thả code vào rồi áp dụng sau vào lại kiểm tra không thấy code đâu nữa
24/2/13
Blog của mình hiện tại cũng đang áp dụng mà. Bạn thử vào template sau đó tìm thử .post img sau đó thêm thuộc tính max-width:98% vào xem thế nào
24/2/13
This comment has been removed by the author.
24/2/13
Hóa ra là trong cách thực hiện thủ thuật thành công hay không còn phụ thuộc vào nhiều yếu tố khác nữa không chỉ đơn thuần làm theo chỉ dẫn là thành công bạn à !1- blogger có cho update hay không ?2- tình trạng mạng nơi người sử dụng mạnh hoặc yếu ?3 -tình trạng template của người đó ra sao ?Mình đã thành công nhưng là theo cách này nè bạn :mình thả code của bạn vô chỗ thêm CSS .phải xóa đi dấu chấm ở đầu khi đó Áp dụng cho blog mới có tác dụng vào lại lần thứ 2 chấm thêm dấu chấm vô đó thi áp dụng mới có tác dụng . mình thấy rằng nơi đó chỗ thêm CSS phải có sự tạc động nhất định nào đó thì vị trí [Áp dụng cho blog ]mới nhận biết được .Sau khi hoàn tất mình vào lại template kiểm tra thì nó hiện diện trong đó [width:98% ]mình nghĩ rằng đã thành công và thử thì thấy hay quá bạn à. cái này với chị em chơi blog quả là 1 tiện ích tuyệt vời mĩ quan miễn góp ý
Mình thấy blog của bạn có rất nhiều thủ thuật hữu dụng thực tế nhãn tiền ,và đặc biệt là bạn rất nhiệt tình chỉ bảo giúp đợ mọi người Đáng quí !!!Đáng quí lắm thay !!! :)) :)) :))
Cảm ơn bạn rất nhiều vì đã chia sẻ 1 tiện ích rất tuyệt :))
24/2/13
Qúa khen rồi :))
Mình đi lượm lặt kiến thức trên internet rồi đăng lên blog vừa để lưu trữ vừa để chia sẻ cho anh em cộng đồng blogger của VN và quan trọng hơn cả mình biết sự khó chịu khi hỏi một ai về vấn đề gì đó nhưng không được hồi đáp ;(
Chúc bạn thành công

Cảm ơn bạn đã ghé thăm Troll VL !
» Tạm thời ngăn không cho comment với chế độ ẩn danh vì có một số bạn không có thành ý cố tình spam. Mong các bạn thông cảm!
» Bạn nên viết bằng Tiếng Việt có dấu để mọi người dễ đọc, dễ bình luận
» Để liên hệ,góp ý và đóng góp bài viết bạn click vào đây
Sử dụng các thẻ sau cho comments
» Chèn nội dung vào blockquote <b rel="quote">Nội dung blockquote</b>
» Chèn nội dung vào note <em rel="note">Nội dung note</em>
» Chèn code vào khung pre <i rel="pre">Nội dung code</i>
» Chèn hình ảnh <i rel="image">Link hình ảnh</i>
» Chèn video từ youtube [youtube]link video[/youtube]
» Chèn link <i rel="anchor">Link</i>

Insert Emoticons
:cuoi
:hihi
:thank
:haha
:meu
:cry
:oaoa
1cuoi
:D
@@
:p
:o
:vi
:ko
:ca
:why
:xin
:lanh
:im
:aoi
:ado
:mda
:tat
0:khoa
a:ab
k:ac
q:ad
w:ae
e:af
l:ag
g:ah
8:ai
9:aj
9:ag
:9a
*Phải có khoảng trống trước các code mới hiển thị mặt cười


Mã Hóa Code Tạo và xem trước comments Cancel Reply
-->