VietTuts

Tự Học Lập Trình Online

  • Home
  • Java
  • Servlet
  • JSP
  • Struts2
  • Hibernate
  • Spring
  • MyBatis
  • Java WS
  • C
  • C++
  • C#
  • Python
  • PHP
  • Excel
  • VBA
  • Web
    • JavaScript
    • JQUERY
    • JSON
    • AJAX
    • CSS
    • HTML
    • HTML5
    • Node.js
    • Angular 7
  • SQL
    • MySQL
    • SQL Server
  • Misc
    • Eclipse
    • Phần mềm tiện ích
    • Cấu trúc DL&GT
    • Selenium Test

HTML Tuts

HTML là gì? Các thẻ HTML Định dạng trong HTML Tiêu đề trong HTML Đoạn văn trong HTML Liên kết trong HTML Ảnh trong HTML Table trong HTML Danh sách trong HTML Danh sách có thứ tự Danh sách không có thứ tự Danh sách mô tả Form trong HTML Thuộc tính Style Comment trong HTML Bảng màu trong HTML Thuộc tính chung trong HTML

Các thẻ HTML

Thẻ HTML Marquee Thẻ HTML Textarea HTML DOCTYPE Thẻ HTML Title Thẻ HTML meta Thẻ HTML Div Thẻ HTML Pre Thẻ HTML Code Thẻ HTML Label Thẻ HTML Input Thẻ HTML Button Thẻ HTML HR Thẻ HTML BR Thẻ HTML Script Thẻ HTML NoScript Thẻ HTML b Thẻ HTML Quotes

Bài học HTML

Text Link trong HTML Image Link trong HTML Email Link trong HTML Frame trong HTML Iframe trong HTML Block trong HTML Thiết lập màu nền (background) trong HTML Màu trong HTML Font trong HTML Thẻ embed - Đa phương tiện trong HTML Tạo chữ chạy (Marquee) trong HTML Style Sheet trong HTML Sử dụng Javascript trong HTML Layout trong HTML Tổng hợp thuộc tính trong HTML Sự kiện (Event) trong HTML Các Font tham khảo trong HTML Mã hóa ASCII trong HTML Bảng ASCII trong HTML Các thực thể HTML Mã hóa URL trong HTML Mã hóa các ngôn ngữ chuẩn ISO trong HTML Mã hóa ký tự trong HTML

Câu hỏi phỏng vấn

Phỏng vấn HTML
1 / 3
❮ ❯

Thiết lập màu nền (background) trong HTML


Block trong HTML
Màu trong HTML

Màu nền (background) trong HTML của trang web mặc định là màu trắng. Bạn không thích màu này và muốn thiết lập một màu nền khác cho trang của bạn. HTML cung cấp cho bạn hai cách sau để cài đặt nền cho trang web của bạn:

  1. Sử dụng màu nền.
  2. Sử dụng hình ảnh làm nền

Hãy xem các ví dụ sau đây để hiểu rõ hơn về 2 cách tiếp cận này:


Nội dung chính

  • Thiết lập màu nền trong HTML - Thuộc tính bgcolor trong HTML
    • Ví dụ thiết lập màu nền trong HTML
  • Thiết lập hình nền trong HTML - Thuộc tính background trong HTML
    • Ví dụ thiết lập hình nền trong HTML
  • Nền hoa văn & trong suốt trong HTML
    • Ví dụ

Thiết lập màu nền trong HTML - Thuộc tính bgcolor trong HTML

Thuộc tính bgcolor được sử dụng để thiết lập màu nền (background color) trong một phần tử HTML, riêng biệt cho các nền của thân trang và bảng. Bạn sử dụng các màu khác nhau để thiết lập nền cho thân trang và bảng. Dưới đây là cú pháp để sử dụng thuộc tính này với bất kỳ thẻ HTML nào.


<tag-name bgcolor="color_value"...>

Giá trị color_value có thể được cài đặt trong các định dạng sau:


<!-- Dinh dang 1 - su dung ten mau -->
<table bgcolor="lime" >
 
<!-- Dinh dang 2 - su dung gia tri hex -->
<table bgcolor="#f1f1f1" >
 
<!-- Dinh dang 3 - su dung gia tri mau bang khai niem RGB -->
<table bgcolor="rgb(0,0,120)" >

Ví dụ thiết lập màu nền trong HTML

Sau đây là một ví dụ về thiết lập màu nền cho một thẻ HTML:


<!DOCTYPE html>
<html>
<head>
<title>Thiet lap mau nen trong HTML</title>
</head>
<body>
<!-- Dinh dang 1 - su dung ten mau -->
<table bgcolor="violet" width="100%">
<tr><td>
Mau nen la mau tim
</td></tr>
</table>
 
<!-- Dinh dang 2 - Su dung gia tri hex -->
<table bgcolor="#6666FF" width="100%">
<tr><td>
Mau nen la xanh da troi
</td></tr>
</table>
 
<!-- Dinh dang 3 - su dung gia tri mau bang khai niem RGB -->
<table bgcolor="rgb(255,0,255)"  width="100%">
<tr><td>
Mau nen la xanh la cay
</td></tr>
</table></body>
</html>

Kết quả:



Thiết lập hình nền trong HTML - Thuộc tính background trong HTML

Thuộc tính background có thể được sử dụng để cài đặt hình nền của một phần tử HTML. Bạn có thể sử dụng một hình ảnh để làm nền cho trang hoặc bảng. Dưới đây là cú pháp để sử dụng thuộc tính này với bất kỳ thẻ HTML nào:

Ghi chú: Thuộc tính background là thuộc tính cũ và được đề nghị để sử dụng Style Sheet cho các thiết lập nền.

<tag-name background="image_url"...>

Các định dạng hình ảnh thường được sử dụng là JPEG, GIF, PNG.

Ví dụ thiết lập hình nền trong HTML

Ví dụ sau để thiết lập ảnh nền cho một bảng.


<!DOCTYPE html>
<html>
<head>
<title>Vi du hinh nen trong HTML</title>
</head>
<body>
<table background="/images/html/html-background-1.jpg" width="100%" height="100%">
<tr><td>
Thiet lap hinh nen cho bang
</td></tr>
</table>
</body>
</html>

Kết quả:


Nền hoa văn & trong suốt trong HTML

Chắc bạn đã nhìn thấy rất nhiều các nền được trang trí hoa văn hay trong suốt trong các trang web. Loại nền này rất dễ dàng có thể tạo được bằng cách sử dụng hình ảnh hoa văn hay trong suốt cho nền.

Bạn nên lưu ý là trong khi tạo các ảnh hoa văn, ảnh GIF trong suốt hoặc ảnh PNG, bạn nên sử dụng kích cỡ nhỏ nhất có thể (nhỏ như 1 x 1) để trành việc hình ảnh bị tải chậm.

Ví dụ

Dưới đây là ví dụ về thiết lập nền hoa văn cho bảng:


<!DOCTYPE html>
<html>
<head>
<title>Vi du hinh nen trong HTML</title>
</head>
<body>
<!-- Thiet lap hinh nen cho bang boi su dung pattrern image -->
<table background="/images/html/html-background-2.png" width="100%" height="100">
<tr><td>
Hinh nen cua bang la mot pattern image.
</td></tr>
</table>
<!-- Thiet lap hinh nen cho bang boi su dung pattrern -->
<table background="/images/html/html-background-3.png" width="100%" height="100">
<tr><td>
Hinh nen cua bang la mot pattern image.
</td></tr>
</table>
</body>
</html>

Kết quả:


Block trong HTML
Màu trong HTML

Recent Updates

Sắp Tết 2024 Rồi! - Còn bao nhiêu ngày nữa là đến tết 2024?Liên kết css với htmlMã hóa ký tự trong HTMLMã hóa các ngôn ngữ chuẩn ISO trong HTMLMã hóa URL trong HTMLCác thực thể HTMLBảng ASCII trong HTMLMã hóa ASCII trong HTMLCác Font tham khảo trong HTMLSự kiện (Event) trong HTMLTổng hợp thuộc tính trong HTMLLayout trong HTMLSử dụng Javascript trong HTML

VietTuts on facebook

Học Lập Trình Online Miễn Phí - VietTuts.Vn
Danh Sách Bài Học

Học Java | Hibernate | Spring
Học Excel | Excel VBA
Học Servlet | JSP | Struts2
Học C | C++ | C#
Học Python
Học SQL

Bài Tập Có Lời Giải

Bài tập Java
Bài tập C
Bài tập C++
Bài tập C#
Bài tập Python
Ví dụ Excel VBA

Câu Hỏi Phỏng Vấn

201 câu hỏi phỏng vấn java
25 câu hỏi phỏng vấn servlet
75 câu hỏi phỏng vấn jsp
52 câu hỏi phỏng vấn Hibernate
70 câu hỏi phỏng vấn Spring
57 câu hỏi phỏng vấn SQL

Scroll back to top

Copyright © 2016 VietTuts.Vn all rights reserved. | Liên hệ | Chính sách - riêng tư | sitemap.html | sitemap_index.xml