Frameworks: Bootstrap
Bootstrap adalah CSS dan JavaScript frameworks. Bootstrap mempunyai template untuk typography, forms, buttons, tables, navigation, modals, image carousels dan lain-lain bagi membina responsive website. Bootstrap boleh diperolehi di getbootstrap.com.
Bootstrap CDN (Content Delivery Network) daripada MaxCDN dan juga memerlukan jQuery.
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
Bootstrap class to wrap site content.
- container = fixed width container
- container-fluid = full width container, spanning the entire width of the viewport
<div class="container"> </div>
Bootstrap Jumbotron, is displayed as a grey box with rounded corners.
<div class="jumbotron"> </div>
Bootstrap table, table-striped, table-bordered, table-hover, table-condensed
<table class="table table-bordered"> </table>
Bootstrap alert, alert-success, alert-info, alert-warning, alert-danger
<div class="alert alert-danger"> </div>
Bootstrap button, btn-default, btn-primary, btn-success, btn-info, btn-warning, btn-danger, btn-link, btn-lg, btn-md, btn-sm, btn-xs, btn-block, btn-group, btn-group-vertical, btn-group-justified
<button type="button" class="btn btn-link btn-lg">Link</button>
Bootstrap progress bar, progress-bar, progress-bar-success, progress-bar-info, progress-bar-warning, progress-bar-danger, progress-bar-striped
<div class="progress"> </div>
Bootstrap dropdown/dropup, divider, dropdown-header, disabled, dropdown-menu, dropup
<div class="dropdown"> </div>
Contoh: http://shahrulnizam.com/web/bootstrap.php
Penerangan lanjut di
Leave a Reply