Siswa Magang : Cara Membuat Glyphicon Bootstrap

Kali ini saya sharing lagi tentang cara membuat atau memasukkan Glyphicon Bootstrap ke HTML kalian, nah pastinya kalian membutuhkan 1 File .html dan .css nah itu untuk yang manual nah untuk memodifikasi agar lebih bagus kalian bisa menambahkan Framework Css yaitu Bootstrap dengan cara mendownload file Bootstrap terlebih dahulu di Website Bootstrap.

Berikut ini adalah tampilan File Bootstrap yang sudah di download dari Website Bootstrap

Cara Membuat Glyphicon Bootstrap

Karena kali ini kita hanya akan menggunakan file bootstrapnya saja kalian bisa masuk ke Direktori CSS -> Copy Bootstrap.css ke folder project kamu yang berisi 1 File HTML dan 1 File CSS

Cara Membuat Glyphicon Bootstrap

Sambungkan style.css dan bootstrap.css ke file HTML kamu dengan cara masukkan script berikut

<link rel=”stylesheet” href=”style.css”> dan <link rel=”stylesheet” href=’’bootstrap.css’’>

Nah lanjut ke topik pembahasan kita kali ini yaitu adalah Memasukkan / Membuat Glyphicon ke html
biasanya untuk memasukkan icon kita menggunakan

<span class=”icon”></span>

Dan pada file css

.icon{
background-image:url(“../file/file.png”);
width:50px;
height:50px;
}

Nah pada bootstrap kalian tidak perlu membuat class icon pada css , kalian hanya memasukkan class yang sudah di sediakan oleh bootstrap nah untuk icon sendiri classnya adalah glyphicon

<span class=”glyphicon-music”></span>

Nah yang berwarna merah itu ganti dengan kode icon yang sudah disediakan bootstrap
berikut ini adalah kode kode icon bootstrap.

Cara Membuat Glyphicon Bootstrap

Sekian dulu sedikit info dan tutor dari saya selamat mencoba.

Loading Facebook Comments ...