Mẹo CSS tự động căn giữa cho ảnh hiển thị trên Web
Cách này áp dụng cho các trang web sử dụng CSS để hiển thị nhé 🙂 Lý do là vì nhiều khi bạn lười edit code, nhiều lúc thì theme của bạn bị lỗi cần phải sửa. Sau đây la cách:
***
Bước 1: Tải file style.css từ Host về máy tính bằng FPT client. (mozilla? ). Mở nó ra bằng text hoặc phần mềm hỗ trợ edit code như Dreamweaver chẳng hạn.
Bước 2: Chèn đoạn Code vào vị trí :
.HAHAHA img {max-width:100% ;margin: 0 auto; display: block; }
Trong đó: HAHAHA là vùng bạn muốn mã mãu đỏ phát huy tác dụng.
Chẳng hạn vùng đó là Wrapper thì sẽ là .wrapper
Bước 3: Lưu file và up đè lên host. Theo dõi kết quả được rồi. Kể từ nay, khi bạn post ảnh, khu vực HAHAHA gì đó sẽ tự động căn giữa.
****
Giải thích ý nghĩa code
.HAHAHA là cách để ta mô tả về class chịu ảnh hưởng.
img là mặc định hiển thị cho ảnh (image)
max-width : qui định độ rộng tối đa. Có thể dùng % hoặc px (pixel)
margin: 0 auto : Lệnh căn chỉnh tự động vào giữa
display: block : hiển thị ảnh dạng 1 hộp, không chèn ngang chữ lên 2 bên.
Giangliao.
Good cảm ơn bạn