Cara Membuat Slider/ Carousel dengan Framework materialize.css
Hallo teman teman bertemu lagi dengan saya Ismet Maulana kali ini saya ingin berbagi pengetahuan mengenai Cara membangun slider/carousel dengan materialize.css. teman teman mungkin telah mengetahui yah apa itu slider di laman, laman tanpa adanya slider mungkin akan terlihat kaku tak menarik apalagi sekiranya isi dari laman tersebut hanya bertuliskan saja mungkin visitor akan cepat bosan melihatnya dan tak akan betah berlama lama diwebsite kalian, oke seketika aja kali ini saya akan menolong teman teman pada memecahkan masalah tersebut agar tampilan laman teman teman tak kaku.
Kali ini saya akan membangun slider dengan bantuan framework materialize.css, teman teman dapat mendownloadnya terlebih dahulu di sini. Oke kalau telah buka filenya dan bikin html baru lalu save dengan nama index.html lalu tuliskan scriptnya dibawah ini :
Script koneksi ke css materialize.css
<head>
<link href=http://fonts.googleapis.com/icon?family=Material+Icons rel=stylesheet>
<link type=text/css rel=stylesheet href=css/materialize.min.css media=screen,projection/>
<meta name=viewport content=width=device-width, initial-scale=1.0/>
</head>
Script body :
<div class=carousel>
<a class=carousel-item href=#one!><img src=images/I.png></a>
<a class=carousel-item href=#two!><img src=images/s2.png></a>
<a class=carousel-item href=#three!><img src=images/m3.png></a>
<a class=carousel-item href=#four!><img src=images/e4.png></a>
<a class=carousel-item href=#five!><img src=images/t5.png></a>
</div>
Kalau telah coba teman teman save dan jalankan di browser teman teman lihat tampilannya :
Berikut tampilannya :
Lumayan gampang bukan ? hingga disini yah teman teman semoga artikel ini bermanfaat .
Terimakasih ..
#KeepLearn
#IsmetMA
Sumber https://kursuswebsite.org
