Căn ảnh ra giữa trong css

     

Căn thân chữ khôn cùng dễ, bạn chỉ cần sử dụng ở trong tính text-align: center; là OK.Còn căn giữa hình ảnh thì lại không dễ như thế! Đã không hề ít lần tôi vò đầu bứt tai vì chẳng căn thân nổi! thực ra kỹ thuật không tồn tại gì quánh biệt, nhưng đề xuất mẹo nhỏ tuổi thì new được. Đấy là điểm sáng chung của mẹo, biết thì rất dễ dàng mà chần chờ thì nặng nề vô thuộc (chém gió tí!)

Giả dụ tôi gồm cái ảnh như này:

Theo mặc định, giống hệt như trên, bức ảnh sẽ dạt về bên cạnh trái, vậy làm rứa nào nhằm tôi mang đến nó ra giữa bây giờ?

Cách có tác dụng như sau:

1. Đầu tiên vào mã lưu lại HTML của ảnh, chúng ta thêm class mang tên là cangiua vào (bất kỳ ảnh nào mong căn thân thì bạn đều đưa class này vô, dùng class sẽ phù hợp hơn id vào trường phù hợp này):

*
2. Tiếp theo sau trong CSS bạn thêm mấy loại sau:

img.cangiua display: block; margin-left: auto; margin-right: auto;Và đấy là kết quả:


Bạn đang xem: Căn ảnh ra giữa trong css


Vậy là xong! tiếng thì căn giữa hình ảnh thật dễ dàng :))

Có thể bạn muốn xem thêm bài trực thuộc tính display trong CSS & margin, padding để nắm rõ hơn ý nghĩa những dòng code trên.


Share this:


Bài liên quan:


Categories css Post navigation
Selector ở trong tính vào CSS
Các hàm xử trí chuỗi trong PHP

25 thoughts on “Cách căn giữa ảnh bằng CSS: cứ tưởng nỗ lực nào!”

*

kghjkhgkhj
November 12, 2015 at 1:36 pm
Kết quả vẫn như cũ

Reply
*

nguyen vu
June 29, 2016 at 8:58 am

hay.like

Reply
*

Xem thêm: Cách Làm Sổ Tiết Kiệm Ngân Hàng Vietcombank Như Thế Nào? Tiền Gửi Tích Lũy Trực Tuyến

Dinhvinhnguyen
April 3, 2017 at 9:57 am

ĐÃ thành công

Reply
*

Anony
March 25, 2018 at 3:58 pm

phải tạo thêm một class nữa trong css như bài viết chứ không tạo thành class thuần được.thay vì:cangiua//nội dungphải là:img.cangiua//nội dungBạn nào làm cho không được rất có thể tham khảo điểm này.

Reply
*

Ý Nhân
March 13, 2020 at 2:42 pm

cho em hỏi làm sao để căn thân như cái logo của anh cố kỉnh ạ

Reply
Kha Nguyen
September 19, 2020 at 10:02 am

Mình mong mỏi canh thân mặc định cho tất cả các ảnh mỗi lần post bài bác thì chèn code như thế nào vào css của theme ạ?

Reply

Leave a comment Cancel reply

Comment

NameEmail

Save my name, email, and website in this browser for the next time I comment.

Δ


Lớp học tư tưởng thiện nguyện 3 miền: Hà Nội, Đà Nẵng, sử dụng Gòn

*