Bài đăng
Bootstrap là gì?
Bootstrap là một framework HTML, CSS, và JavaScript cho phép người dùng dễ dàng thiết kế website. Bootstrap là phần không thể thiếu để tạo các website thân thiện với thiết bị cầm tay như mobile, ipad, tablet,... Hiện nay, Mobile-First Index đang là thuật toán đánh giá website được ưu tiên nhất của Google. Điều nó khiến cho vai trò vủa Bootstrap càng trở nên quan trọng hơn. Vậy lý do nên sử dụng Bootstrap là gì? |
| Bootstrap là ngôn ngữ không thể thiếu khi nói đến lập trình web |
Lý do sử dụng Bootstrap là gì?
 |
| Việc sử dụng Bootstrap trong thiết kế web khiến website tương thích với mọi kích cỡ trình duyệt và thiết bị khác. |
Từ cái "chuẩn mực" này, chúng ta có thể thấy rõ được những điểm thuận lợi khi sử dụng Bootstrap.
- Dễ sử dụng: Bootstrap được dựa trên HTML, CSS và Javascript. Chỉ cẩn có kiến thức cơ bản về các ngôn ngữ đó là có thể sử dụng bootstrap tốt.
- Responsive: Bootstrap xây dựng sẵn reponsive css trên các thiết bị Iphones, tablets, và desktops. Tính năng này khiến cho người dùng tiết kiệm được rất nhiều thời gian trong việc tạo ra một website thân thiện với các thiết bị điện tử, thiết bị cầm tay.
- Tương thích với trình duyệt: Bootstrap tương thích với tất cả các trình duyệt. Ví dụ như: Chrome, Firefox, Internet Explorer, Safari, ...... Tuy nhiên, với IE browser, Bootstrap chỉ hỗ trợ từ IE9 trở lên. Điều này vô cùng dễ hiểu vì IE8 không support HTML5 và CSS3.
Cách download Bootstrap
Có 2 cách để bạn có thể sử dụng Bootstrap trên web của bạn.- Download Bootstrap packet từ getbootstrap.com
- Thêm Bootstrap từ CDN
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->3
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
Cách tạo trang Boostrap đơn giản nhất
Bootstrap HTML5 doctype là gì?
Bootstrap sử dụng các phần tử HTML và các thuộc tính CSS yêu cầu HTML5 doctype.Luôn bao gồm HTML5 doctype ở đầu trang, cùng với thuộc tính lang và bộ ký tự chính xác:
 |
| Code ví dụ cho Bootstrap HTML5 Doctype |
Bootstrap mobile-first là gì?
Bootstrap được thiết kế để responsive với các thiết bị di động. Mobile-first styles là một phần của core framework.Để đảm bảo hiển thị chính xác và thu phóng bằng cách chạm, hãy thêm thẻ <meta> sau vào phần tử <head>:
Phần initial-scale=1 sẽ đặt mức thu phóng ban đầu khi trang được trình duyệt tải lần đầu tiên.
Bootstrap Container là gì?
Bootstrap cũng đòi hỏi một containing element để bọc nội dung trang.Có hai container classes để lựa chọn:
- .container class cung cấp một container với chiều rộng cố định đáp ứng (responsive fixed width container).
- .container-fluid class cung cấp một container có chiều rộng đầy đủ, trải rộng toàn bộ chiều rộng của khung nhìn.
Hai trang Bootstrap cơ bản
Ví dụ sau đây thể hiện code cho một trang Bootstrap cơ bản (với responsive fixed width container):
Bình luận:
0 comments: