Nền cho phần tử html

HTML | background Attribute

Cải thiện bài viết

Lưu bài viết

Thích bài viết

  • Độ khó. Dễ dàng
  • Cập nhật lần cuối. 28 tháng 3 năm 2022

  • Đọc
  • Bàn luận
  • khóa học
  • Luyện tập
  • Băng hình
  • Cải thiện bài viết

    Lưu bài viết

    The HTML background Attribute is used to specify the background-image for the document. 
    Ghi chú. Nó không được HTML5 hỗ trợ Thay vì sử dụng thuộc tính này, chúng tôi sử dụng thuộc tính nền CSS.  

    cú pháp.  

    Giá trị thuộc tính. Nó chứa giá trị tôi. e URL Xác định địa chỉ của hình nền.  
     

    • URL tuyệt đối. Nó trỏ đến một trang web khác
    • URL tương đối. Nó trỏ đến một tệp trong một trang web

    Thí dụ.  
     

    html




    <html>

     

    <head>

        <0>

    23

        5_______1_______0>

    5_______6_______>

     

    <1

    <<3 <4<5

    <6>

    ________số 8_______

        <html1>

    2<___html5html6html5>

    2<___>1>2<3>4>1>

    2

    2<___<0 <1<5<3>

    <5_______2_______6

    25_______2_______0>

        5_______3_______1>

    5_______2_______3>

    head8

     

    5_______3_______>

    đầu ra.  
     

    Supported Browsers: The browser supported by background Attribute are listed below: 
     

    • Google Chrome
    • trình duyệt web IE
    • firefox
    • Cuộc đi săn
    • Ô-pê-ra

     

    Ghi chú cá nhân của tôi arrow_drop_up

    Tiết kiệm

    Vui lòng Đăng nhập để nhận xét.

    Khi duyệt trực tuyến, bạn có thể thường bắt gặp các trang web có nền đầy màu sắc, được thể hiện bằng hình nền hoạt hình, đồ họa, màu trơn hoặc thậm chí là toàn bộ hình ảnh. Đặt kiểu nền cho trang web được thực hiện với sự trợ giúp của thuộc tính nền điển hình của các phần tử HTML

    Nội dung

    Thuộc tính nền trong phần tử HTML

    Sử dụng thuộc tính nền trong mã HTML của các trang của bạn, bạn có thể đạt được các hiệu ứng màu thực sự hấp dẫn cho sự hiện diện trên web của mình. Bạn có thể sử dụng thuộc tính đó theo hai cách cơ bản - thông qua Cascading Style Sheets (CSS) hoặc bằng cách đặt trực tiếp các thuộc tính nền trong các phần tử HTML. Mặc dù phương pháp CSS được sử dụng rộng rãi và được ngày càng nhiều nhà thiết kế ưa thích, nhưng việc đặt nền cho các trang web của bạn thông qua HTML được coi là một kỹ thuật lỗi thời với nhiều tính không linh hoạt.

    Đặt nền thông qua CSS

    Áp dụng kiểu nền cho các trang của bạn thông qua CSS rất linh hoạt. Bạn có thể xác định thuộc tính nền cho bất kỳ phần tử HTML nào - từ một ô trong bảng đến toàn bộ trang trên trang web của bạn. Thuộc tính có nhiều biến thể tùy theo chính xác thuộc tính nền mà bạn muốn xác định

    Thuộc tính màu nền

    Với thuộc tính này, bạn có thể đặt màu nền cho bất kỳ thành phần nào của trang. Ví dụ: bạn có thể tô màu nền của đoạn văn hoặc bảng hoặc đặt phần đệm một màu cho toàn bộ trang nếu cần

    Example of using the background-color property for one paragraph marked with :


    Đây chỉ là một đoạn văn mẫu cho bạn thấy một đoạn văn bản
    trên trang của bạn sẽ trông như thế nào với bộ màu nền

    Đây là cách đoạn màu sẽ trông như thế nào trực tuyến

    Đây chỉ là một đoạn văn bản mẫu cho bạn thấy một đoạn văn bản trên trang của bạn sẽ trông như thế nào với một bộ màu nền

    Ví dụ về sử dụng thuộc tính màu nền cho tiêu đề của bảng









    Quốc giaCờ
    Hy LạpCờ Hy Lạp

    Đây là cách tiêu đề bảng màu sẽ trông như thế nào trực tuyến

    Đất NướcCờHy LạpCờ Hy Lạp

    Example of using the background-color property for the whole page (marked with ):


    <đầu>


    Trang này được đặt trên nền màu vàng

    Đây là cách trang màu sẽ trông giống như trực tuyến

    Thuộc tính hình nền

    Sử dụng thuộc tính này, bạn có thể đặt hình ảnh làm nền cho một thành phần riêng biệt trên trang web của mình hoặc cho toàn bộ trang web

    Example of using the background-image property for one paragraph (marked with ):


    Đây chỉ là một đoạn văn mẫu mực cho bạn thấy một đoạn văn như thế nào
    trên trang của bạn sẽ trông như thế nào với một bộ ảnh nền

    Đây là cách đoạn hình nền sẽ trông như thế nào khi trực tuyến

    Example of using the background-image property for the whole page (marked with ):


    <đầu>


    Trang này được đặt trên một

    Đây là giao diện của trang đặt nền hình ảnh trực tuyến

    Thuộc tính vị trí nền

    Sử dụng thuộc tính nền này, bạn có thể đặt hình nền ở một vị trí nhất định. Vị trí hình ảnh có thể được đặt theo phần trăm hoặc theo pixel. Đơn vị đo lường phổ biến nhất được sử dụng là %, như được hiển thị trong ví dụ bên dưới. Bằng cách đặt vị trí của hình nền thành 50%-50%, bạn sẽ đặt hình ảnh ở giữa đoạn văn

    Ví dụ về việc sử dụng thuộc tính vị trí nền (tính bằng %) cho hình nền


    Đây chỉ là một đoạn văn mẫu mực cho bạn thấy một đoạn văn như thế nào
    trên trang của bạn sẽ trông như thế nào với một hình nền được đặt ở trung tâm

    Đây là giao diện của trang hình nền trực tuyến ở vị trí trung tâm

    Thuộc tính lặp lại nền

    Thuộc tính này được sử dụng để chỉ định xem một hình nền được đặt cho một thành phần nhất định của trang hay cho toàn bộ trang có phải được lặp lại hay không. e. có hiển thị trong ô xếp hay không và cách thực hiện việc này. Các giá trị có thể của nó bao gồm. lặp lại (hình nền lặp lại theo cả chiều ngang và chiều dọc), lặp lại-x (hình ảnh chỉ lặp lại theo chiều ngang), lặp lại-y (nền chỉ lặp lại theo chiều dọc), no-repeat (nền không lặp lại)

    Example of using the background-repeat property for one paragraph (marked with ):


    Đây chỉ là một đoạn văn mẫu mực cho bạn thấy một đoạn văn như thế nào
    trên trang của bạn sẽ trông như thế nào với một bộ hình nền lặp đi lặp lại

    Thuộc tính nền

    Nếu bạn muốn áp dụng nhiều thuộc tính nền khác nhau cho một và cùng một thành phần, bạn có thể sử dụng thuộc tính nền chung để chỉ định tất cả chúng một cách ngắn gọn và dễ dàng. Sử dụng hầu hết các thuộc tính từ các ví dụ đoạn văn trên (màu nền, hình ảnh, vị trí căn giữa, hình ảnh lặp lại), thuộc tính nền sẽ có dạng sau

    Làm cách nào tôi có thể đặt nền trong HTML?

    Cách phổ biến và đơn giản nhất để thêm hình nền là sử dụng thuộc tính hình nền bên trong thẻ . Thuộc tính nền mà chúng tôi đã chỉ định trong thẻ

    Làm cách nào để áp dụng kiểu nền cho các phần tử HTML bằng CSS?

    điều kiện tiên quyết
    Thiết lập HTML và CSS ban đầu
    Sử dụng màu nền và hình nền trên Elements
    Lát ảnh với Thuộc tính lặp lại nền
    Điều chỉnh vị trí của hình nền với vị trí nền
    Thay đổi kích thước hình nền với thuộc tính kích thước nền

    2 loại nền HTML là gì?

    HTML cung cấp cho bạn hai cách hay sau đây để trang trí nền trang web của bạn. .
    Nền HTML với Màu sắc
    Nền HTML với hình ảnh