#12 CSS – Icon

Dalam penggunaan icon pada halaman website, kita bisa menggunakan fasilitas icon dari font-awesome. Berikut cara penggunaan font awesome pada html.

font-awesome
  • Masuk ke menu icon dan pilih icon yang diinginkan dengan cara copy tag i seperti pada gambar..
copy-icon

Berikut file index.html

<!DOCTYPE html>
<html>

<head>
    <title>Page Title</title>
    <link rel="stylesheet" type="text/css" media="screen" href="style.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
        crossorigin="anonymous">
</head>

<body>
    <h1><i class="fas fa-home"> Beranda</i></h1>
    <h1><i class="fas fa-camera"></i> Galeri</h1>
    <h1><i class="fas fa-lock-open"></i> Login</h1>
</body>

</html>

Hasil dari index.html diatas

icons

Tinggalkan sebuah komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *