[BÀI 5] Định dạng nền trong CSS

Định dạng nền trong CSS – Background

Background là một thuộc tính rất quan trọng khi bạn sử dụng CSS để tạo nên một trang web hoàn chỉnh. Bài hôm nay chúng ta sẽ đi tìm hiểu về Background và các thành phần cơ bản mà ta hay sử dụng.

Các thành phần của background mà chúng ta sẽ tìm hiểu trong bài hôm nay :

        +Background-attachment

        +Background-color

        +Background-image

        +Background-position

        +Background-repeat

1. Background dùng để làm gì?

Background là một thuộc tính rút gọn để thiết lập các thuộc tính nền trong một khai báo.

2. Cú pháp, cách sử dụng của từng thành phần background

+Background-attachment : Thiết lập một ảnh liệu có đứng cố định một chỗ hay cuộn theo phần văn bản còn lại của trang

Cú pháp :

        Background-attachment: fixed (cuộn theo văn bản)

       Background-attachment: scroll (cố định tại một vị trí)

+Background-color : Thiết lập màu nền cho phần tử

Cú pháp :

         Background-color : tên_màu

Trong đó tên màu có thể là mã màu hoặc tên màu bằng tiếng anh

Ví dụ :

         Background-color : red;

+Background-image : Thiết lập 1 ảnh của trang như là một nền

Cú pháp :

         Background-image : url(“đường dẫn tới ảnh”);

Ví dụ :

        Background-image : url(“devpro.jpg”);

+Background-repeat : Thiết lập sự lặp lại của ảnh nền

Cú pháp :

            Background-repeat : repeat (lặp trên toàn bộ trang)

           Background-repeat : repeat-x (lặp theo chiều ngang)

           Background-repeat : repeat-y (lặp theo chiều dọc)

          Background-repeat : no-repeat (không lặp)

+Background-position : Thiết lập điểm xuất phát của một ảnh nền

Cú pháp :

         background-position: top left; (góc trên bên trái)

         background-position: top right;(góc trên bên phải)

         background-position: top center;(ở giữa bên trên)

         background-position: bottom left;(góc dưới bên trái)

        background-position: bottom right;(góc dưới bên phải)

        background-position: bottom center;(ở giữa bên dưới)

        background-position: center center;(ở giữa vùng)

>> Học xong Css bạn có thể học php cơ bản

3. Kết luận :

Bài hôm nay chúng ta đã tìm hiểu về thuộc tính background và các thành phần cơ bản của background. Ở bài sau, chúng ta sẽ tìm hiểu về cách định dạng văn bản văn bản trong CSS

Để tìm hiểu chi tiết hơn, các bạn có thể tham khảo các khóa học tại đây.!!!

Chúc các bạn thành công !!!!

Gợi ý xem thêm:

• Hướng dẫn lập trình ios cơ bản
• Nên hoc lap trinh game unity o dau