Mặc dù tự dán nhãn cho mình là một nhà phát triển phụ trợ, nhưng tôi đã tham gia nhiều hơn và nhiều hơn với thiết kế phía trước, cụ thể là vì JavaScript đã làm mờ các đường giữa hai. Trong dự án cuối cùng của tôi, tôi đã hack một chút với HTML và CSS để phát triển các phong cách đáp ứng - có thể là một nỗi đau.
Rất may, các khung như Bootstrap [trước đây gọi là Twitter Bootstrap] thực hiện các yêu cầu thiết kế như vậy khá đơn giản và thậm chí đơn giản hơn với việc phát hành Bootstrap 3 mới.
Hãy để một cái nhìn.
Đây là một loạt 3 phần. Trong phần đầu tiên, chúng tôi sẽ chỉ nhìn vào Bootstrap 3 và cách tùy chỉnh nó bằng HTML và CSS. Trong phần thứ hai, chúng tôi sẽ xem xét cách thiết lập một trang đích bán hàng hiệu quả. Kiểm tra nó ở đây. Cuối cùng, trong phần cuối cùng, chúng tôi sẽ thêm Python vào hỗn hợp để xây dựng một trang đích bằng Flask + Bootstrap 3.
Bạn có thể lấy các kiểu/trang cuối cùng từ repo này.
Tạo bố cục trang web tối thiểu
Bắt đầu bằng cách tải xuống Bootstrap từ trang web chính thức. Giải nén zip và lấy thư mục dist. Đây sẽ là thư mục gốc của chúng tôi cho dự án nhỏ này. Hãy chắc chắn thêm
Bootstrap Template
Bootstrap