Cara Membuat CSS dengan jQuery CSS

Siang hari yang tidak ada matahari nya membuat cuaca sangat mendukung untuk saya berbagi ilmu kepada kalian tentang Cara Membuat CSS dengan jQuery CSS.

Pada umunya CSS dibuat pada CSS external atau yang disebut juga dengan CSS tapi berbeda file dengan file HTML nya. Dan CSS internal atau yang disebut juga dengan CSS di satu file yang bersamaan dengan file HTML yang dibuat pada tag <head> dan diawali dengan tag <script>. Yang terakhir CSS inline style atau yang disebut juga dengan CSS di file yang sama dengan file HTML kemudian CSS nya ditulis di dalam tag yang ingin kita beri style CSS. Nah berikut saya akan memberitahukan kepada kalian bagaimana Cara Membuat CSS dengan jQuery CSS.

Pertama-tama silahkan teman-teman buat file index.html nya

Kemudian isikan library jquery nya di tag <head> dan dibungkus dengan tag <script>,

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>

Setelah itu buat di dalam tag <body> tag-tag seperti berikut,

<h2>jQuery CSS</h2>

<p style="background-color:#ff0000">ini adalah paragraph.</p>
<p style="background-color:#00ff00">ini adalah paragraph.</p>
<p style="background-color:#0000ff">ini adalah paragraph.</p>

<p>ini adalah paragraph.</p>

<button>Klik disini untuk mengubah style CSS nya</button>

Lalu terakhir buat script nya pada tag <head>,

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("p").css({"background-color": "yellow", "font-size": "200%"});
    });
});
</script>

Bagaimana teman-teman untuk Cara Membuat CSS dengan jQuery CSS nya? cukup mudah bukan?

Sekian untuk tutorial kali ini, semoga bermanfaat

Terima kasih

Kategori