Tổng quan
Trong bất cứ một ngành design nào nói chung và ngành design web nói riêng, bố cục chính là bộ xương cho toàn bộ thiết kế, không có bố cục thì thiết kế này coi như một đống hổn độn.
Trong lập trình web củng vậy, bất kì một design nào củng sẽ phải tuân theo một bố cục nhất định, tuy nhiên vì đã là thiết kế thì sẽ không bao giờ có giới hạn. Các designer càng sáng tạo bao nhiêu thì phần công việc triển khai của các lập trình viên lại càng khó bấy nhiêu.
Trong CSS, nếu Grid được xin ra nhằm xây dựng bộ lưới để sắp xếp khung hình và vị trí của các element cùng lớp trên một trang web, ví dụ như header, footer và container. Thì position củng được xin ra nhằm mục đích hổ trợ xây dựng và sắp xếp vị trí cho các element nhưng là đối với các element có quan hệ với nhau, cụ thể hơn là được bao bọc bởi nhau hay còn gọi là quan hệ "cha con ông".
Vậy trong bài hôm nay hãy cùng Lùn Dev đi tìm hiểu về position trong CSS được hoạt động như thế nào nhé.
Phương pháp tìm hiểu
Là một lập trình viên, chúng ta thừa biết rỏ rằng code không nằm ở sách vở hay định nghĩa, việc học nó một cách giáo khoa sẽ không mang lại nhiều kết quả củng không giúp chúng ta nhớ lâu. Học theo cách này buộc lòng chúng ta phải trải qua ba bước: đọc định nghĩa, xem hướng dẩn dùng cơ bản, sau đó mới đến bước vận dụng vào thực tế. Thì có lẻ khi này việc vận dụng vào thực tế sẽ phải khiến bạn rất băn khoăn vì lúc nào củng vậy học và thực tế là khác nhau. Chưa kể nếu dán đoạn thì bạn phải lặp lại hai bước đầu để nhớ lại.
Nắm bắt được tâm lí đó mình xin chia sẽ về cách tìm hiểu position cùng mọi người với phương pháp đó là tìm hiểu, thực hành và triển khai vào dự án thực tế cùng một lúc. Như vậy bạn sẽ không còn phải khó khăn trong việc hình dung nó sẽ được áp dụng vào thực tế như nào nửa.
Hình ảnh kết quả sau bài học