Cara Membuat Theme dengan W3.CSS

Kejujuran sesungguhnya bukan terletak di mulut tetapi di hatimu. Lumayan rasakan dan ikuti, karenanya kebahagiaan disana akan menanti. Halo semuanya, lama tak bersua. Apa kabar? Terbaik dan nomor satu nya ya pasti. Oke di kesempatan kali ini saya akan berbagi ilmu kepada kalian mengenai bagaimana Cara Membangun Theme dengan W3.CSS.



Theme yang dimaksud yaitu memasukkan warna basic bagi badan blog kita. Di W3.CSS banyak alternatif warna yang dapat teman-teman pilih.


Penampakan nya seperti ini teman-teman:



Kejujuran



Oke seketika saja, berikut Cara Membangun Theme dengan W3.CSS.



Pertama-tama-tama, silahkan siapkan file index.html nya.



Kemudian, isi di bagian <head> bagi menghubungkan file HTML kita dengan link library W3.CSS.



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


Dan hubungkan pun HTML kita dengan library warna dari W3.CSS di bagian <head>.



<link rel=stylesheet href=/lib/w3-theme-orange.css>


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



<div class=w3-card-4>
<div class=w3-container w3-theme w3-card-2>
<h1>Orange</h1>
</div>

<div class=w3-container w3-text-theme><h2>w3-text-theme</h2></div>

<ul class=w3-ul w3-border-top>
<li class=w3-theme-l5 style=position:relative>
<a class=w3-btn-floating-large w3-theme-action w3-right style=position:absolute;top:-28px;right:16px;>+</a>
<p>w3-theme-l5 (w3-theme-light)</p>
</li>
<li class=w3-theme-l4>
<p>w3-theme-l4</p>
</li>
<li class=w3-theme-l3>
<p>w3-theme-l3</p>
</li>
<li class=w3-theme-l2>
<p>w3-theme-l2</p>
</li>
<li class=w3-theme-l1>
<p>w3-theme-l1</p>
</li>
<li class=w3-theme>
<p>w3-theme</p>
</li>
<li class=w3-theme-d1>
<p>w3-theme-d1</p>
</li>
<li class=w3-theme-d2>
<p>w3-theme-d2</p>
</li>
<li class=w3-theme-d3>
<p>w3-theme-d3</p>
</li>
<li class=w3-theme-d4>
<p>w3-theme-d4</p>
</li>
<li class=w3-theme-d5>
<p>w3-theme-d5 (w3-theme-dark)</p>
</li>
</ul>
</div>


Bagaimana teman-teman? lumayan gampang bukan?



Sekianlah bagi panduan kali ini mengenai bagaimana Cara Membangun Theme dengan W3.CSS.



Semoga bermanfaat, terima kasih




Sumber https://kursuswebsite.org

Popular posts from this blog

Cara Menghapus Isi Dari Form Input Menggunakan Javascript

Membuat Form Menarik Menggunakan HTML dan CSS