Bootstrap là gì? Giới thiệu và hướng dẫn cách sử dụng Bootstrap 3
Bạn đang xem bài viết Bootstrap là gì? Giới thiệu và hướng dẫn cách sử dụng Bootstrap 3. Một vài liên kết tham khảo: thiết kế web trọn gói thiết kế web thời trang
Bootstrap và những điều cần biết: Khi thiết kế web hay sử dụng các dịch vụ thiết kế web chắc hẳn bạn đã nghe qua nhiều lần khái niệm này… Khi một lập trình viên nói rằng họ thiết kế web dựa trên “công nghệ Boostrap”, có lẽ bạn vẫn chưa hình dung được nó là gì và cách nó vận hành như thế nào trong một website. Bài viết này của chúng tôi sẽ giải đáp cho bạn các khúc mắc cơ bản!
Bootstrap là framework HTML, CSS và JavaScript phổ biến nhất để phát triển các trang web có tính phản hồi, tích hợp di động. Nếu bạn mong muốn sở hữu một Website Responsive, tương thích với mọi trình duyệt và thiết bị di động, chắc chắn sẽ cần dùng đến công nghệ này.
Bootstrap bao gồm các mã CSS + HTML cơ bản cho typography, forms, buttons, tables, grids, navigation, và nhiều thành phần khác trong một website. Điều này giúp cho các designer tránh việc phải lặp đi lặp lại trong quá trình tạo ra các class CSS và các đoạn mã HTML giống nhau trong khi thiết kế web. Style của các phần tử HTML trong Bootstrap khá đơn giản và thanh lịch. Ví dụ như phần đổ bóng trong input, highlight của bảng biểu, các mã CSS hiển thị cảnh báo, tabs, phân trang…
Vậy giữa nhiều công nghệ thiết kế web hiện nay, tại sao nên sử dụng Bootstrap?
Không như các phiên bản trước đây, Bootstrap 3 được mặc định hỗ trợ Responsive. Ở bản bootstrap 3 font glyphicons-halflings-regular được thay thế cho glyphicons-halflings.png
Ký hiệu lớp |
Thiết bị | Độ rộng lớp container | Chú thích |
.col-xs-$ | Extra small | Auto | Dùng cho điện thoại kích thước nhỏ hơn 768 pixels |
.col-sm-$ | Small devices | 750px | Dùng cho tablets kích thước >= 768 pixels |
.col-md-$ | Medium devices | 970px | Dùng cho desktop ( >=992 pixels) |
.col-lg-$ | Large devices | 1170px | Dùng cho desktops >=1200 pixels |
Với $ là một số nằm trong khoảng từ 1-12.
Cấu trúc bootstrap 3:
Cấu trúc folder Boostrap 3 như sau:
Đây là cấu trúc file html (hoặc htm) được chứa trong folder bootstrap (bạn có thể đặt tên folder này là tùy ý) theo đường dẫn như ảnh trên.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | < 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" > < title >Sài thử Bootstrap < link alt = "css/bootstrap.min.css" rel = "stylesheet" > < body > < span class = "container" > < span >Hellow Bootstrap! < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" > < script src = "js/bootstrap.min.js" > |
Như vậy chúng tôi đã chia sẻ với bạn những kiến thức cơ bản nhất về Boostrap 3. Tin rằng đây là một công nghệ mới tối ưu và sẽ được sử dụng rất nhiều trong tương lai đặc biệt là trong thiết kế website chuyên nghiệp!
Vẫn còn nhiều thắc mắc cần được giải đáp? Hãy liên hệ với chúng tôi ngay qua số hotline 1800 6016. Chúng tôi xin cam đoan sẽ hỗ trợ bạn hết mức và mang lại những giải pháp tốt nhất.
—
? web3c – GIẢI PHÁP THIẾT KẾ WEB HÀNG ĐẦU CHO DOANH NGHIỆP ?
? Địa chỉ: Mekong Tower, 235-241 Cộng Hòa, Phường 13, Quận Tân Bình, TP.HCM
? Hotline: 1800 6016
? Email: email@web3c.vn
? Website: www.web3c.vn
➡ Facebook: https://www.facebook.com/web3c.vn/
Liên lạc ngay với chúng tôi hoặc để lại thông tin của bạn, bộ phận tư vấn của web3c sẽ liên lạc lại ngay để giải đáp mọi thắc mắc! Trong trường hợp tổng đài BẬN LIÊN TỤC và QUÁ TẢI đơn hàng, vui lòng để lại thông tin của bạn thông qua emai hoặc tin nhắn để chúng tôi có thể tìm lại bạn trong hàng ngàn khách hàng.
Ngoài ra các bạn cũng có thể xem BẢNG BÁO GIÁ WEBSITE CHUẨN của chúng tôi tại đây.
Nguồn bài viết: Bootstrap là gì? Giới thiệu và hướng dẫn cách sử dụng Bootstrap 3
báo giá xây nhà: giá xây nhà 2018 - giá thép xây dựng : báo giá thép hôm nay - khách sạn sài gòn : http://khachsansaigon.com.vn/ - mái xếp bình dương : mái xếp bình dương - cung cấp bạt giá rẻ : bạt che thùng mui xe tải | Thuốc lá điện tử IQOS Việt Nam : http://www.iqosvietnam.net/iqos.html