Rumah >hujung hadapan web >html tutorial >Warna HTML

Warna HTML

王林asal: 2024-09-04 16:33:57641semak imbas

Artikel ini merangkumi cara menggunakan warna dalam laman web menggunakan HTML dengan cara yang mudah dan mudah. Warna memainkan peranan penting dalam mencipta tapak web agar kelihatan dan berasa baik. Tiada teg individu terbina dalam HTML; sebaliknya, ia menggunakan atribut gaya atau sifat warna. Tepatnya, warna dibenamkan dalam elemen HTML menggunakan Cascading Style Sheet (CSS). Warna memberikan rupa yang elegan pada halaman web. Menambah warna pada halaman web termasuk menetapkan warna latar belakang, jadual, perenggan, dll.

Bagaimana untuk Menetapkan Warna Latar Belakang dalam HTML?

Menjadikan warna latar belakang cerah menjadikan tapak web kelihatan cantik dan lebih berani. Ia dilakukan dengan menggunakan warna, kod warna Hex. Nilai warna RGB dan RGBA (Nilai Alpha 0 hingga 1).

Warna hex digunakan terus pada kod Html menggunakan atribut Gaya di dalam elemen badan Html. Hex ialah gabungan kedua-dua nombor dan huruf. Di bawah ialah contoh yang menggambarkan warna Latar belakang pada halaman web.

Kod:

<!DOCTYPE html>
<title>My Sample</title>
<html>
<head>
<title>HTML BG Color</title>
</head>
<body style="background-color:red;">
<h1> This page is a demo </h1>
</body>
</html>

Coretan Kod:

Warna HTML

Untuk menambah warna latar belakang, anda boleh menggunakan atribut bgcolor untuk memaparkan < badan bgcolor=’ ‘>. Ia serasi dengan semua pelayar kecuali dalam HTML 5.

Kod:

<h3 style="color: blue">Color Name</h3>
<h3 style="color: #0000ff">Hexadecimal</h3>
<h3 style="color: rgb (0,0,255)">RGB Value</h3>

Bagaimana untuk Memohon Warna pada Teks dalam HTML?

Memohon warna pada teks HTML agak mudah; kita boleh menambah/ menukar warna teks dengan menggunakan tiga cara iaitu warna Hex, nilai HSL dan nama warna. Berikut ialah tiga teknik berbeza untuk menggunakan warna pada halaman web yang sepadan.

1. Nama Warna

Ini agak mudah dengan menggunakan nama warna Inggeris apabila aplikasinya lurus ke hadapan nama warna ini digunakan. Menentukan nama warna ialah kaedah langsung dan W3C telah mengumumkan 16 warna asas (Hitam, kuning, merah, Maroon, Kelabu, Limau, Hijau, Zaitun, Perak, Aqua, Biru, Tentera Laut, Putih, Ungu, Fuchsia, Teal)

2. HSL

Nilai warna ketepuan rona dan kecerahan. Hue ditakrifkan dalam 0 hingga 360 darjah, ketepuan dan kecerahan dari 0 hingga 100 %.

3. Warna Hex

Untuk mendapatkan hasil yang tepat, enam digit nombor perenambelasan digunakan. Untuk menghuraikan, dua digit pertama menandakan Merah, dua digit seterusnya menandakan Hijau, dua lagi menandakan nilai Biru dan didahului dengan ‘#’.

Contoh berikut menerangkan cara yang berbeza untuk menggunakan warna pada dokumen.

Kod:

<head>
<title>EDUCBA</title>
<style type="text/css">
h1{
color:#97cae0;
background-color: hsl(200, 50%, 20%);
color: hsl(200, 20%, 90%);
}
h4{
color:rgb(0, 255, 0);
background-color: hsl(130, 10%, 30%);
color: hsl(280, 20%, 80%);
}
li{
color:rgba(12, 88, 120, 1);
background-color: hsl(210, 36%, 50%);
color: hsl(145, 45%, 81%);
}
</style>
</head>
<body>
<h1>EDUCBA</h1>
<h4>List of operating System</h4>
<ul>
<li> Windows</li>
<li>MACINTOSH</li>
<li>LINUX</li>
<li>UBUNTU</li>
</ul>
</body>
</html>

Output:

Warna HTML

Terdapat kaedah berbeza untuk melakukan warna teks kerana HTML mempunyai banyak aplikasi yang boleh disesuaikan.

Menggunakan bahagian gaya
Membuat helaian gaya CSS individu
Membungkus teks

Cara Memohon Warna Teks menggunakan Bahagian?

Mari kita lihat pelbagai kaedah untuk menggunakan warna HTML:

1. Membungkus Menggunakan Warna HTML

Kod di bawah menukar warna teks dalam perenggan dengan kod HTML mudah. Terdapat 140 nama berwarna untuk mewarnai laman web.

Kod di bawah menunjukkan cara menggunakan warna teks menggunakan