Cách Xóa Khoảng Trắng Thừa Bên Dưới Hình ảnh Bằng CSS

Trang chủ » Khoảng Trắng Trong Css » Cách Xóa Khoảng Trắng Thừa Bên Dưới Hình ảnh Bằng CSS

Có thể bạn quan tâm

VZN.vn - Hướng dẫn tự học lập trình, phát triển website Trang chủ Phát triển web Wordpress Quản trị Web Thủ thuật Tự học PHP Tự học Python Hỏi đáp Phát triển web PHPJavascriptHTML/CSSMySQL & NoSQLPython Wordpress Hướng dẫn WordpressThemes WordpressWordpress DevelopmentWordpress Plugin Quản trị Web Kiến thức DomainThủ thuật HostingQuản trị LinuxCẩm nang SEOAd Network Thủ thuật Máy tínhĐiện thoạiPhần mềmTiếng Anh Hướng dẫn
  • Trang chủ
  • HTML / CSS
  • Cách xóa khoảng trắng thừa bên dưới hình ảnh bằng CSS
Quảng cáo Cách xóa khoảng trắng thừa bên dưới hình ảnh bằng CSS

Chủ đề: HTML / CSSBài trước|Bài tiếp

Trả lời: Sử dụng thuộc tính CSS display

Nếu bạn cố gắng đặt một hình ảnh bên trong một phần tử <div> có đường viền, bạn sẽ thấy thêm một khoảng trắng (khoảng 3px) ở cuối hình ảnh. Điều này xảy ra bởi vì hình ảnh là một phần tử cấp nội tuyến nên trình duyệt sẽ thêm một số khoảng trắng dưới đường cơ sở để điều chỉnh các phần tử nội tuyến khác.

Cách dễ nhất để loại bỏ vấn đề này là thay đổi giá trị mặc định display của hình ảnh từ nội dòng thành khối, tức là áp dụng kiểu display: block;trên hình ảnh, như được hiển thị bên dưới:

Ví dụ

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Remove White Space Below Images</title> <style> .img-box{ width: 125px; border: 4px solid #333; } .img-box img{ display: block; } </style> </head> <body> <div class="img-box"> <img src="images/club.jpg" alt="Club Card"> </div> </body> </html>

Câu hỏi liên quan

Dưới đây là một số câu hỏi thường gặp khác liên quan đến chủ đề này:

  • Tạo danh sách tùy chỉnh ul li với hình ảnh?
  • Làm sao để thay đổi kích thước hình ảnh bằng CSS?
  • Hướng dẫn cách làm nổi bật nền của hàng trong bảng luân phiên bằng CSS
  • Độ dài tối đa của tiêu đề và thẻ mô tả trong HTML cho SEO là bao nhiêu
  • Cách hiển thị và ẩn menu thả xuống khi di chuột bằng CSS
Unknown Error Unknown Error Unknown Error: [2] Undefined array key "PREV_PAGE" File: /home/vzn.vn/public_html/config/vzn.template.php(491) : eval()'d codeLine: 1 Powered by VZN Template - Copyright © VZN Template

Từ khóa » Khoảng Trắng Trong Css