Bootstrap 3 Tutorial - What is Bootstrap? Framework Bootstrap is the most popular front end framework since one time earlier. How to install bootstrap? this lessons will explaint how we strated to create web responsive design using bootstrap.
Getting Strated
First step, we need to download Bootstrap files from offical website http://getbootstrap.com/getting-started/#downloadNext, create new project in your localhost/server and open it with your Text editor, we will create new file (index.html) and add basic template using bootstrap.
Bootstrap Basic Template
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>My First Bootstrap Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for 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/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1>Hello, world!</h1>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
now, just execute and try our index.html page, you will get an first bootstrap page, that have a responsive design using desktop or mobile.
Không có nhận xét nào:
Đăng nhận xét