Vì một tương lai người Do Thái!

Đăng ký thành viên của team front-end
Làm ơn hãy bật JavaScript!

Thursday, November 30, 2017

Responsive - Hướng dẫn cách thiết kế Website chuẩn W3C

Thiết kế web đáp ứng là gì?

Thiết kế web đáp ứng làm cho trang web của bạn trông đẹp trên tất cả các thiết bị (máy tính để bàn, máy tính bảng và điện thoại).

Thiết kế web đáp ứng là về cách sử dụng HTML và CSS để thay đổi kích thước, ẩn, co lại, phóng to hoặc di chuyển nội dung để làm cho nó trông đẹp trên bất kỳ màn hình nào:


Thiết lập Viewport

<meta name="viewport" content="width=device-width, initial-scale=1.0">


Thao tác này sẽ đặt chế độ xem trang của bạn, hướng dẫn của trình duyệt về cách kiểm soát kích thước và quy mô trang.


Theo mình nghĩ các bạn nên sử dụng bootstrap cho web vì nó dễ sử dụng:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <div class="jumbotron">
    <h1>My First Bootstrap Page</h1>
  </div>
  <div class="row">
    <div class="col-sm-4">
      ...
    </div>
    <div class="col-sm-4">
      ...
    </div>
    <div class="col-sm-4">
    ...
    </div>
  </div>
</div>

</body>
</html>

Bản Quyền || Cấm sao chép nội dung dưới mọi hình thức. Nếu muốn sao chép hãy để 5 phút đọc xong các chính sách của chúng tôi tại đây.

Tác giả: Minh Trung