Share Thiết kế giao diện website với CSS framework Tachyons

filiallion · 11/26/2019

Thiết kế giao diện website các bạn sẽ nghĩ tới Bootstrap, UIkit, Metro hay cao cấp hơn có thể là React, Angular,... Với sự hỗ trợ của các thư viện này, các bạn sẽ dễ dàng thiết kế hoàn chỉnh giao diện website cũng như việc quản lý mã lập trình trở nên tốt hơn. Bài viết này tôi sẽ giới thiệu với các bạn một CSS framework khác đó là Tachyons.

Cũng giống như Bootstrap, UIkit hay Metro, Tachyons là một thư viện CSS cung cấp các thành phần dùng để xây dựng giao diện website như layout, form, list, table, image,... Tuy nhiên, Tachyons lại thiên về các thành phần nhỏ trên website hơn là các thành phần mang tính tổng thể. Điểm mạnh của thư viện Tachyons theo đánh giá của tôi đó chính là việc hỗ trợ trình bày bố cục, với rất nhiều các thành phần hỗ trợ, các bạn sẽ dễ dàng bố trí bố cục website theo bất kỳ cách thức nào các bạn muốn mà không cần phải viết thêm dòng mã lệnh CSS nào nữa.

Để sử dụng thư viện Tachyons, các bạn tải tại địa chỉ https://github.com/tachyons-css/tachyons và tích hợp vào website với dòng mã lệnh HTML như sau:

HTML:

<link href="path/to/tachyons.min.css" rel="stylesheet">

Bây giờ, các bạn tạo một bố cục như ví dụ sau:

HTML:

<div class="flex">
    <div class="outline w-30">Column 1</div>
    <div class="outline w-30">Column 2</div>
    <div class="outline w-30">Column 3</div>
</div>

Các bạn có thể tìm hiểu thêm về CSS framework Tachyons tại địa chỉ https://tachyons.io/docs.

Share Thiết kế giao diện website với CSS framework Tachyons

filiallion

Administrator