Front-end Nên dàn layout web sử dụng kiểu cũ thẻ div với css(float, clear) hay sử dụng flexbox trong css 3?

[hell6w9rld (HelloWorld)]

Chào các bạn
mình không phải dân chuyên web, mới tập tọe qua web được 1 thời gian, mục đích m muốn build 1 blog cá nhân giao diện đơn giản để viết linh tinh các thứ , mà k sử dụng framework, hay sinh mã tự động từ các công cụ khác (code thủ công)
m đã lên ý tưởng cho giao diện và phác thảo, giờ đến phần dựng layout, theo m biết có 3 kiểu dàn layout:

• dùng table (lỗi thời, nhiều nhược điểm_
• dùng thẻ div và css (float, clear) phổ biến
• dùng flexbox trong css3 (new)
  theo tìm hiểu thì flexbox trong css 3 khá tiện lợi, nhưng m vẫn đang phân vẫn giữa 2 kiểu dùng thẻ div với css và dùng flexbox trong css 3
  theo các bạn nên dùng cách nào?
  xin cảm ơn

[hell6w9rld (HelloWorld)]

@huytd help help

[Vong_Hoang_Tuong (null)]

Nên dùng flexbox.
Tuy nhiên còn phụ thuộc vào người dùng web của bạn nữa, nếu hấu hết sử dụng trình duyệt hiện đại thì thoải mái mà triển. Nếu không dùng div vẫn tốt chán, code dài hơn tí thôi.

[Quan_Tran (HelloTheWorld)]

Nên dùng flexbox, bạn có thể lấy grid của bootstrap v4.

Grid system

[Dao_An (Đào An)]

Cái nào mới thì dùng thôi, việc gì phải dùng cái cũ, số lượng trình duyệt ko hỗ trợ flexbox là rất ít.

[hell6w9rld (HelloWorld)]

mình không muốn dùng mấy framework, vì thấy nó thừa code nhiều chỗ, với lại blog m xây dựng cũng đơn giản. nhưng theo m tìm hiểu flexbox chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ

[Quan_Tran (HelloTheWorld)]

Nó có hổ trợ lấy riêng phần layout đó bạn, chổ download có option download

[hell6w9rld (HelloWorld)]

nhưng theo m tìm hiểu flexbox chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ

[Quan_Tran (HelloTheWorld)]

nhưng theo m tìm hiểu flexbox chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ

Hởi khó hiểu :v, flexbox củng là css mà

[hell6w9rld (HelloWorld)]

nhưng theo m tìm hiểu flexbox chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ

nhưng theo m tìm hiểu flexbox chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ.

[hell6w9rld (HelloWorld)]

flexbox là chức năng mới trong css 3, còn cách dùng thẻ div với css ý là dùng kiểu id, với mấy thuộc tính float, clear ấy

[hell6w9rld (HelloWorld)]

nhưng theo m tìm hiểu flexbox trong css 3 chỉ nền dùng cho các container bé trong trang còn dàn layout chính thì vẫn nên dùng div với css là sao nhỉ

[Quan_Tran (HelloTheWorld)]

Đầu tiên, người ta it khi dùng ID để style, bạn có thể google hỏi thêm
Thứ 2 flexbox đã được hổ trợ gần như hết rồi, flexbox hổ trợ layout dễ hơn khá nhiều nên không phải suy nghĩ nhiều.
https://caniuse.com/#search=flexbox

[hell6w9rld (HelloWorld)]

theo m tìm hiểu là
cách 1 dùng table
cách 2 dùng thẻ div trong html , kết hợp với css để format
cách 3: dùng chức năng flexbox trong css 3

cách 2 thì chia web theo bố cục, sử dụng mỗi bố cục con 1 id, header, footer, nav, content, menu . . .v.v.
sau đó dùng thẻ div để cục bộ mỗi phần, rồi dùng css viết class sử dụng 2 thuộc tính hỗ trợ dàn trang là float và clear đê dàn layout, ý m là thế, còn cách 2 hay 3 đều dùng css cả
m cũng tính làm thử với flexbox nhưng đọc trên 1 số trang bảo là chỉ nên dùng flexbox dàn các container bé, còn khung layout chính nên dùng cách 2

[Quan_Tran (HelloTheWorld)]

Về cái ID cho mổi section thì ok, mình củng hay dùng ID cho mổi section nhưng không style dựa vào ID!.
Còn về cái float hay flexbox thì tùy bạn . Nếu như người ta nói như vậy thì sao thằng Bootstrap 4 với foundation hay sematic lại chuyển qua dùng flexbox mà không dùng float nữa thì :v…

[hell6w9rld (HelloWorld)]

mình thấy nhiều trang nói thế, nhưng xem ngày viết bài thì là 1 năm trước, k biết giờ thế nào :3

[Dao_An (Đào An)]

từ khi dùng flexbox m ko còn sài grid system hay float nữa; mọi thứ 2 thằng kia làm đc thì flexbox đều làm đc , mà viết mã đẹp hơn nhiều .

[pwkeygen (Trịnh Tâm (fb.com/bboykeygen))]

Nói chung là giờ flex dùng đc rồi, vì phần lớn các trình duyệt có hỗ trợ, scope của các dự án cũng chả bao giờ yêu cầu làm cho IE10 trở xuống nữa ( mà dám đòi là mình cancel )

[void]

Flexbox nên dùng để layout component, theo cách bạn nói là container bé.

Grid nên dùng để layout cho page, theo cách bạn nói là khung layout chính.

Bạn đọc thêm ở đây nhé:
https://hackernoon.com/the-ultimate-css-battle-grid-vs-flexbox-d40da0449faf

Flexbox is made for one dimensional layouts and Grid is made for two dimensional layouts.

[votruonggiang1990]

mình không muốn dùng mấy framework,

FlexBox có phải là framework gì đâu nhỉ ?