Cara mengganti gaya , size dan warna huruf pada HTML
Oke, ada 2 cara untuk mengganti gaya huruf, ukuran huruf dan warna huruf yaitu melalui tag <style> CSS dan juga dengan tag <font> yang ditambahkan dengan atribut yang dibutuhkan.
Cara pertama yaitu dengan cara membuat script style css diantara tag <head> dan </head> , Dibawah ini adalah contoh scriptnya.
<html>
<head>
<title> SiiCoder.xyz </title>
<style>
body {
font-family: Courier New; // Untuk gaya huruf
font-size: 25px; // Untuk size huruf
color: blue; // Untuk warna huruf
}
</style>
</head>
<body>
Ini font Algerian dengan size 25px warna biru
</body>
</html>
<head>
<title> SiiCoder.xyz </title>
<style>
body {
font-family: Courier New; // Untuk gaya huruf
font-size: 25px; // Untuk size huruf
color: blue; // Untuk warna huruf
}
</style>
</head>
<body>
Ini font Algerian dengan size 25px warna biru
</body>
</html>
Maka akan seperti ini hasilnya
Ini font Algerian dengan size 25px warna biru
Warna, ukuran dan juga gaya huruf bisa diganti sesuai dengan kebutuhan kalian.
Cara kedua yaitu menggunakan tag <font> serta menambahkan atributnya, atribut font yaitu size (ukuran) , color (warna) , face (gaya huruf). Dibawah ini merupakan contoh script menggunakan atribut tersebut.
<html>
<head>
<title> SiiCoder.xyz </title>
</head>
<body>
<font face="courier" size="7" color="red "> Ini font Courier dengan size 7 warna merah </font>
</body>
</html>
<head>
<title> SiiCoder.xyz </title>
</head>
<body>
<font face="courier" size="7" color="red "> Ini font Courier dengan size 7 warna merah </font>
</body>
</html>
Maka hasilnya akan seperti ini.
Ini font Courier dengan size 7 warna merah
face merupakan atribut font untuk mengubah gaya huruf yang kalian butuhkan, size merupakan atribut font untuk mengatur ukuran huruf, color merupakan atribut font yang berfungsi untuk mengatur warna pada huruf. Jadi, face, color, size pada script diatas, bisa kalian ganti menjadi apa yang kalian butuhkan.
Oke sekian tentang bagaimana cara mengganti size, gaya dan warna huruf pada HTML. Follow SiiCoder & Share it :)
Komentar (0)
Post a Comment