Apa Itu Bootstrap dan Cara Menggunakanya
Kali ini saya akan membahas cara menggunakan Bootstrap, sebelumnya Bootstrap sendiri adalah :
Quote:Twitter Bootstrap adalah sebuah alat bantu untuk membuat sebuah tampilan halaman website yang dapat mempercepat pekerjaan seorang pengembang website ataupun pendesain halaman website. Sesuai namanya, website yang dibuat dengan alat bantu ini memiliki tampilan halaman yang sama / mirip dengan tampilan halaman Twitter atau desainer juga dapat mengubah tampilan halaman website sesuai dengan kebutuhan.
Bahasa script yang digunakan pada Bootstrap adalah HTML, CSS, dan Java Script.
[#] Cara Install Bootstrap
1. Silahkan download dulu Bootstrapnya disini kemudian extract file.zip tersebut dalam 1 folder
Code:
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.min.css
│ ├── bootstrap-theme.css
│ └── bootstrap-theme.min.css
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
└── glyphicons-halflings-regular.woff2. Basic template bootstrap
Setelah di extract silahkan buat sebuah file .html di folder yang sama lalu copy & paste script dibawah :
PHP Code:
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1>Hello, world!</h1> <!-- Mulai Coding Disini -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html> Nah sekarang bootstrap siap digunakan, untuk refrensi kalian bisa lihat di :
Code:
http://getbootstrap.com/[#] Sebagai Contoh penggunaan Bootstrap dalam pembuatan Button
PHP Code:
<button type="button" class="btn btn-success">Dengan Bootstrap</button>
<button type="button"> Tanpa Bootstrap</button>
sumber http://forum.idca.or.id/thread-3043.html
Posting Komentar untuk "Apa Itu Bootstrap dan Cara Menggunakanya"