Bootstrap adalah sebuah framework yang membantu mempermudah dalam mendesain web. Sesuai dengan slogan yang diusungnya yakni mendesain sebuah website dengan lebih rapi, cepat dan mudah. Dalam tampilan halaman website yang menggunakan Bootstrap ini akan tampak tetap rapi, baik versi mobile maupun desktop.
Untuk menjalankannya terlebih dahulu kita harus mendownload atau mengunduhnya di getbootstrap. setelah mendownload-nya lalu extract filenya. Kita akan mendapat 3 folder yakni :
1. css
2. fonts
3. js
copikan tiga folder diatas ke folder tempat penyimpanan proyek program yang akan kita buat. misalnya nama foldernya : coba
Lalu buat satu file index.html,
ketikkan didalamnya kode seperti dibawah ini :
<html>
<head>
<title>Coba</title>
<meta name="viewport" content="device-width,initial-scale=1.0">
<!-- bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
<h1>Selamat datang Bootstrap</h1>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
lalu save as ke dalam folder coba, dengan nama index.html. Lalu running di browsing kita dan bandingkan dengan html biasa, tampilan font-nya akan lebih menarik.
penjelasan :
syntax : <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
adalah untuk memanggil css file bootstrap
syntax : <script src="js/bootstrap.min.js"></script> adalah untuk memanggil js (jquery) file bootstrap
Selamat mencoba!
nb : sebelum belajar Bootstrap diharapkan sudah mengetahui dasar-dasar html, CSS dan PHP.
Untuk menjalankannya terlebih dahulu kita harus mendownload atau mengunduhnya di getbootstrap. setelah mendownload-nya lalu extract filenya. Kita akan mendapat 3 folder yakni :
1. css
2. fonts
3. js
copikan tiga folder diatas ke folder tempat penyimpanan proyek program yang akan kita buat. misalnya nama foldernya : coba
Lalu buat satu file index.html,
ketikkan didalamnya kode seperti dibawah ini :
<html>
<head>
<title>Coba</title>
<meta name="viewport" content="device-width,initial-scale=1.0">
<!-- bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
<h1>Selamat datang Bootstrap</h1>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
lalu save as ke dalam folder coba, dengan nama index.html. Lalu running di browsing kita dan bandingkan dengan html biasa, tampilan font-nya akan lebih menarik.
penjelasan :
syntax : <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
adalah untuk memanggil css file bootstrap
syntax : <script src="js/bootstrap.min.js"></script> adalah untuk memanggil js (jquery) file bootstrap
Selamat mencoba!
nb : sebelum belajar Bootstrap diharapkan sudah mengetahui dasar-dasar html, CSS dan PHP.
Tidak ada komentar:
Posting Komentar