Cara Membuat Alert Pada W3.CSS

Ingatlah, jika kita susah, ada yang lebih susah dari kita, jika kita miskin, ada yang lebih miskin dari kita. bersyukurlah atas apa yang ada. Oke kali ini saya akan berbagi ilmu kepada kalian tentang bagaimana Cara Membuat Alert Pada W3.CSS.

Pada W3.CSS banyak macam-macam warna Alert yang dapat kita pakai pada Source Responsive ini. Class warna yang terdiri dari Alert pada W3.CSS ini terdiri dari Red, Orange, Yellow, Green dan Blue. Itulah Class warna yang teman-teman bisa pakai di W3.CSS untuk website atau blog kalian.
Oke langsung saja, berikut Cara Membuat Alert Pada W3.CSS.

Seperti biasa, pertama terlebih dahulu siapkan file index.html nya.

Kemudian, isi di bagian <head> link untuk menghubungkan dengan W3.CSS nya.

<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">

Selanjutnya, isi di bagian <body> tag-tag seperti gambar di bawah.

<body class="w3-container">

<h2>Displaying Alerts</h2>

<p>w3-container class dapat digunakan untuk memunculkan alert.</p>

<div class="w3-container w3-red">
  <h3>Danger!</h3>
  <p>Ini alert.</p>
</div>

<div class="w3-container w3-orange w3-text-white">
  <h3>Warning!</h3>
  <p>Ini alert.</p>
</div>

<div class="w3-container w3-yellow">
  <h3>Warning!</h3>
  <p>Ini alert.</p>
</div>

<div class="w3-container w3-green">
  <h3>Success!</h3>
  <p>Ini alert.</p>
</div>

<div class="w3-container w3-blue">
  <h3>Info!</h3>
  <p>Ini alert.</p>
</div>

</body>

Bagaimana teman-teman? cukup mudah bukan?

Sekian untuk tutorial kali ini tentang Cara Membuat Alert Pada W3.CSS.

Semoga bermanfaat, terima kasih

Kategori