Bài 33: Thư Viện Hình ảnh Trong CSS | Tìm ở đây

Trang chủ » Thư Viện Html Css » Bài 33: Thư Viện Hình ảnh Trong CSS | Tìm ở đây

Có thể bạn quan tâm

Bài 33: Thư viện hình ảnh trong CSS

CSS có thể sử dụng để tạo một thư viện hình ảnh. img_gallery

Thư viện hình ảnh

Ví dụ này tạo thư viện hình ảnh với CSS:

<html> <head> <style> div.gallery { margin: 5px; border: 1px solid #ccc; float: left; width: 180px; } div.gallery:hover { border: 1px solid #777; } div.gallery img { width: 100%; height: auto; } div.desc { padding: 15px; text-align: center; } </style> </head> <body> <div class="gallery"> <a target="_blank" href="https://timoday.edu.vn/wp-content/uploads/2021/04/img_5terre.jpg"> <img src="https://timoday.edu.vn/wp-content/uploads/2021/04/img_5terre.jpg" alt="Cinque Terre" width="600" height="400"> </a> <div class="desc">Add a description of the image here</div> </div> <div class="gallery"> <a target="_blank" href="https://timoday.edu.vn/wp-content/uploads/2021/04/img_forest.jpg"> <img src="https://timoday.edu.vn/wp-content/uploads/2021/04/img_forest.jpg" alt="Forest" width="600" height="400"> </a> <div class="desc">Add a description of the image here</div> </div> <div class="gallery"> <a target="_blank" href="https://timoday.edu.vn/wp-content/uploads/2021/05/img_lights.jpg"> <img src="https://timoday.edu.vn/wp-content/uploads/2021/05/img_lights.jpg" alt="Northern Lights" width="600" height="400"> </a> <div class="desc">Add a description of the image here</div> </div> <div class="gallery"> <a target="_blank" href="https://timoday.edu.vn/wp-content/uploads/2021/04/img_mountains.jpg"> <img src="https://timoday.edu.vn/wp-content/uploads/2021/04/img_mountains.jpg" alt="Mountains" width="600" height="400"> </a> <div class="desc">Add a description of the image here</div> </div> </body> </html>

Ví dụ khác

Responsive Image Gallery Cách sử dụng CSS media để tạo thư viện ảnh đáp ứng trông đẹp mắt trên máy tính để bàn, máy tính bảng và điện thoại thông minh.

Tags: CSS Image GalleryThư viện hình ảnh trong cssTìm hiểu CSS Image Gallery

  • Next story Bài 34: Hình ảnh Sprites trong CSS
  • Previous story Bài 32: Dropdowns trong CSS

You may also like...

  • Khoá học CSS 0

    Bài 24: Bố cục CSS – Căn chỉnh chiều ngang và chiều dọc

    29/04/2021

    by Trần Thanh · Published 29/04/2021

  • Khoá học CSS 0

    Bài 36: Forms – Biểu mẫu trong CSS

    04/06/2021

    by Trần Thanh · Published 04/06/2021

  • Khoá học CSS 0

    Bài 25: Vùng chọn trong CSS

    04/05/2021

    by Trần Thanh · Published 04/05/2021 · Last modified 24/05/2021

Để lại một bình luận Hủy

Bạn phải đăng nhập để gửi bình luận.

Từ khóa » Thư Viện Html Css