Phan noi dung co Background Color la mau vang.
Thiết lập hình CSS Để thiết lập màu CSS, bạn sử dụng thuộc tính background-image Giá trị url xác định đường dẫn đến nơi bạn lưu giữ hình ảnh http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com body { background-image: url(" /css/images/css.jpg"); background-color: #cccccc; } Hoc CSS co ban tai VietJack! Lặp lại hình CSS Nếu bạn muốn hình lặp lặp lại theo chiều ngang theo chiều dọc, bạn sử dụng thuộc tính background-repeat CSS Thuộc tính có giá trị: • repeat: Giá trị mặc định Hình lặp lặp lại theo chiều dọc lẫn chiều ngang • repeat-x: Hình lặp lặp lại theo chiều ngang • repeat-y: Hình lặp lặp lại theo chiều dọc • no-repeat: Hình khơng lặp lặp lại Dưới ví dụ minh họa cho giá trị thuộc tính backgroud-color Để thực hành, bạn nên chọn hình ảnh có kích cỡ nhỏ để thấy rõ hiệu ứng Theo mặc định, thuộc tính background-repeat có giá trị repeat url(" /css/images/css.jpg"); background-repeat CSS. body { background-image: background-repeat: repeat; }Vi du ve gia tri mac dinh cua thuoc tinh Kết là: Ví dụ minh họa cách lặp hình theo chiều dọc sử dụng giá trị repeat-y thuộc tính background-color: body { background-image: url(" /css/images/css.jpg"); background-repeat: repeat-y; }
Vi du ve gia tri repeat-y cua thuoc tinh background-repeat CSS. Kết là: Ví dụ minh họa cách lặp hình theo chiều ngang sử dụng giá trị repeat-x thuộc tính background-color: http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com body { background-image: url(" /css/images/css.jpg"); background-repeat: repeat-x; }
Vi du ve gia tri repeat-x cua thuoc tinh background-repeat CSS. Kết là: Thiết lập vị trí hình CSS Để thiết lập vị trí cho hình nền, bạn sử dụng thuộc tính background-position CSS Đơn vị thường sử dụng để xác định giá trị cho thuộc tính background-position px Ví dụ sau minh họa cách thiết lập vị trí hình cách cạnh trái 100 px url(" /css/images/css.jpg"); the. body { background-image: background-position:100px; }
Vi du ve dat hinh nen tai mot vi tri cu Kết là: Ví dụ sau minh họa cách thiết lập vị trí hình cách cạnh trái 100 px, cạnh 200px body { background-image: url(" /css/images/css.jpg"); background-position:100px 200px; }
Vi tri hinh nen duoc xac dinh la: 100px va 200px. Kết là: Thiết lập vị trí hình CSS Nếu bạn muốn thiết lập hình cố định scroll được, bạn sử dụng thuộc tính background-attachment CSS Thuộc tính nhận hai giá trị fixed scroll tương ứng Hai ví dụ minh họa cách sử dụng hai giá trị thuộc tính background-attachment CSS body { background-image: url(' /css/images/css.jpg'); background-repeat: no-repeat; background-attachment: fixed; }
Hinh nen duoc dat co dinh Ban khong the Scroll.
Kết là: http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com Ví dụ sau minh họa cách thiết lập cho hình Scroll: body { background-image: url(' /css/images/css.jpg'); background-repeat: no-repeat; background-attachment:scroll; }Vi du minh hoa cho gia tri scroll cua thuoc tinh background-attachment.
Voi gia tri nay, ban co the scroll hinh nen.
Kết là: Thuộc tính background CSS Để tối thiểu lượng code cần viết, bạn sử dụng thuộc tính background CSS để xác định thuộc tính liên quan tới hình Thứ tự giá trị thuộc tính bạn sử dụng thuộc tính background là: • background-color • background-image • background-repeat • background-attachment • background-position Sẽ khơng có vấn đề giá trị khơng xác định, miễn thuộc tính thiết lập theo thứ tựDoan van co hinh nen co dinh (gia tri fixed) va co the lap di lap lai (gia tri repeat)!
http://vietjack.com/ Trang chia sẻ các bài học online miễn phí ... định, thuộc tính background- repeat có giá trị repeat url(" /css/ images /css. jpg"); background- repeat CSS. body { background- image: background- repeat:... hai giá trị thuộc tính background- attachment CSS body { background- image: url(' /css/ images /css. jpg'); background- repeat: no-repeat; background- attachment:... body { background- image: url(' /css/ images /css. jpg'); background- repeat: no-repeat; background- attachment:scroll; }Vi du minh hoa cho gia tri scroll cua thuoc tinh background- attachment.