Học Flexbox CSS qua ví dụ | Flexbox CSS | Flexbox layout | Flexbox example | Flexbox trong CSS

Поділитися
Вставка
  • Опубліковано 30 лис 2024

КОМЕНТАРІ • 202

  • @F8VNOfficial
    @F8VNOfficial  3 роки тому +19

    👉Khóa Học HTML CSS Pro tốt nhất bạn có thể tìm thấy: fullstack.edu.vn/landing/htmlcss

    • @otaiey2858
      @otaiey2858 2 роки тому +1

      ai có link bài tập cho mình xin với ạ :'(

    • @_NguyenQuocDuy
      @_NguyenQuocDuy 2 роки тому

      anh oi sao em vao link khong duoc vay anh

    • @khoainh9725
      @khoainh9725 2 роки тому

      anh ơi cho em xin link bài tập của mình vs ạ

    • @khoainh9725
      @khoainh9725 2 роки тому +1

      @@otaiey2858 b có link bài tập của bài này k

  • @namtothanh2818
    @namtothanh2818 4 роки тому +34

    Học lý thuyết không hiểu, vô học khóa anh hiểu cặn kẽ luôn . thấu hiểu những cái người mới học không hiểu và giải thích đơn giản - dễ hiểu. FREE nhưng RẤT CHẤT LƯỢNG

  • @trung3497
    @trung3497 3 роки тому +6

    em là một sinh viên năm nhất ngành tkđh đang học đến phần lập trình web. rất cảm ơn anh vì những bài giảng cực kì có tâm như này ạ

  • @uongta4542
    @uongta4542 4 роки тому +5

    Đang làm lại ví dụ của anh Đặng Sơn, liền chạy vô đây để cảm ơn anh rất nhiều bởi vì nhờ bài giảng này mà em đã làm được nhiều thứ từ thuộc tính này, với một người mới học lập trình như em thì video thật sư giúp em rất nhiều. Cám ơn anh Đặng Sơn một lần nữa. Chúc anh ngày càng mạnh khỏe và thành công.

  • @learningonline5533
    @learningonline5533 4 роки тому +5

    Anh Sơn làm ứng dụng thực thế qua dự án thực tế như này, rất hay và cuốn hút... vừa có sản phẩm thực tế vừa học thêm được công nghệ...like 1000 lần cho anh

  • @minhhawithlife
    @minhhawithlife 7 днів тому

    bài dạy hay, dễ hiểu và thực tiễn quá, omca, cảmo= ơn anh đã bỏ thời gian và công sức để xây dựng bài học này ạ :>

  • @HaiNguyen-rx2og
    @HaiNguyen-rx2og Рік тому +1

    quá tuyệt vời đăng kí học bên funix mà toàn qua bên này học. cảm ơn f8

  • @scotlripb8731
    @scotlripb8731 4 роки тому +7

    khoá học FE có tâm nhất từ trước đến giờ đây rồi, cảm ơn a. vẫn đang hóng những bài giảng của a :))

  • @taiothe6612
    @taiothe6612 3 роки тому +2

    anh làm rất có tâm,nói rất dễ nghe dễ hiểu

  • @kevinkhanglego
    @kevinkhanglego 4 роки тому +3

    Không có từ nào để chê được khóa học này. Cảm ơn F8 Official. Mong rằng kênh sẽ ra nhiều khóa học hơn nữa

  • @linhtrinh6797
    @linhtrinh6797 2 роки тому +3

    This is the best lesson about flex box. Thank you so much for sharing.

  • @learningonline5533
    @learningonline5533 4 роки тому +4

    Khóa học rất hay anh ạ, sau đợt bảo vệ này chắc em phải xem kĩ hơn

  • @petrmai9152
    @petrmai9152 3 роки тому

    Đỉnh của chóp. Nếu không có người giảng dạy như anh thì ko biết bao giờ mới hiểu rõ đc flex như thế này.

  • @lap_trinh_c_cong_cong
    @lap_trinh_c_cong_cong Рік тому

    Video chất lượng quá ạ , vừa bổ sung kiến thức mới lại còn giúp ôn lại kiến thức cũ 😊

  • @hoanglinhnguyen2807
    @hoanglinhnguyen2807 4 роки тому +1

    Anh giảng hay dễ hiểu, giọng quá đã, truyền đạt cực kỳ first

  • @tricoo5786
    @tricoo5786 Рік тому

    Cảm ơn anh đã cho em một bài học thật bổ ích! Bài giảng rất có tâm và dễ hiểu

    • @LongPhạm-r7w9o
      @LongPhạm-r7w9o Рік тому

      anh ơi anh có thể cho e xin 13 dòng css đầu được k a

    • @eomihuyen8674
      @eomihuyen8674 3 місяці тому

      @@LongPhạm-r7w9ocó k cậu

  • @enton438
    @enton438 4 роки тому

    { kênh làm flex-box dễ hiểu nhất việt nam;
    tuyệt vời;
    cảm ơn anh; }

  • @linhhandsome8947
    @linhhandsome8947 3 роки тому

    Em xin gửi lời cảm ơn đến Anh, khóa học của anh rất bổ ích ạ.

  • @nguyenthientu4830
    @nguyenthientu4830 Рік тому

    cảm ơn anh rất nhiều , chúc anh luôn mạnh khỏe để giúp mọi người nhiều hơn nữa !

  • @quannguyen-sn6jm
    @quannguyen-sn6jm 4 роки тому +1

    học cái hiểu hết luôn á thầy. e cảm ơn thầy đã bỏ thời gian ra làm những video như thế này ạ. Chúc thầy có thật nhiều sức khỏe ạ

  • @phamvinh8993
    @phamvinh8993 4 роки тому +1

    Video của anh giải thích rất chi tiết và cặn kẽ , chứng tỏ anh hiểu biết rất sâu và rõ. Cảm ơn a vì đã đóng góp cho cộng đồng

  • @minhngoc9687
    @minhngoc9687 4 роки тому

    Video quá hay và dễ hiểu. Cảm ơn bạn rất nhiều. Mong chờ nhiều series video hay của bạn.

  • @khoaphan5521
    @khoaphan5521 3 роки тому +1

    Anh giảng bài hay quá , rất dễ hiểu !!

  • @minhnhatnguyen8200
    @minhnhatnguyen8200 2 роки тому

    Học trên youtube đụng tới bài này hơi khó hiểu , nhưng mà vào khóa anh có bài tập vừa đọc vừa làm dễ hiểu cực

  • @phamnhuquyet9110
    @phamnhuquyet9110 3 роки тому +1

    Anh giảng hay và chi tiết thật sự ấy =))). Xem video của anh mới biết học Css chưa bao giờ là đủ. Hóng a ra tiếp video

    • @dungg2038
      @dungg2038 3 роки тому

      bác biết code từ dòng 13 2:27 trở xuống ở phần css ko, giúp em với e ko tạo đc cái thanh cam như video

  • @quocoai3867
    @quocoai3867 3 роки тому

    Video rất tuyệt vời, chúc bạn có nhiều sức khỏe chia sẽ nhiều kiến thức cho anh em

  • @ionllking7456
    @ionllking7456 Рік тому

    hay thực sự, giá mà đại học cũng dạy như này, giáo trình trường em dạy kiểu đâm ngang xương không, mà toàn lý thuyết ko đưa ra thực hành cụ thể, may xem được clip này chứ không cũng bỏ ngành này r

  • @nguyenthanhtung3625
    @nguyenthanhtung3625 4 роки тому

    Chưa bao giờ mà xem bài giảng hay và dễ hiểu như vậy

  • @khangta1577
    @khangta1577 4 роки тому

    Em đang cày lại mà thấy anh dạy hay quá !! Em cảm ơn anh!

    • @TheKing-tt6dg
      @TheKing-tt6dg 2 роки тому

      chắc giờ bạn cũng đi làm rồi nhỉ - giờ mình mới học lại không biết có trụ nổi không

  • @MN-wi2lm
    @MN-wi2lm 4 роки тому +2

    Khóa frontend của a rất hay, mong a ra video nhanh nhanh tới phần cắt web

    • @F8VNOfficial
      @F8VNOfficial  4 роки тому

      Từ tuần sau bắt đầu cắt web nha em

    • @tunamusic2314
      @tunamusic2314 4 роки тому

      khóa có mất phí không anh

  • @BaoTran-gd8di
    @BaoTran-gd8di 3 роки тому +1

    không thể tin được mấy cái này free luôn á =)) quá tuyệt vời thầy Sơn

  • @hyu191
    @hyu191 3 роки тому +1

    Nội dung hay, ví dụ thực tế, cảm ơn anh ạ!

  • @quyenphan5905
    @quyenphan5905 4 роки тому +3

    bài giảng của anh bài bản thứ tự dễ vào quá ạ, trước em có từng học html css r mà vẫn phải cày lại :))))

  • @trang1812
    @trang1812 Рік тому

    cảm ơn a vì bài giảng rất tâm huyết :))) em đã like video và sub ủng hộ

  • @atnguyentien8630
    @atnguyentien8630 4 роки тому

    Đã xem tới đây. A dạy dễ hiểu quá ạ.

  • @super17542
    @super17542 2 роки тому

    Anh giảng rất dễ hiểu, cảm ơn anh nhiều

  • @Remy46577
    @Remy46577 3 роки тому

    vid chứa đầy đủ các nội dung của flexbox, tuyệt

  • @hicee
    @hicee 3 роки тому

    Giọng bạn hay thiệt với lại bạn giảng có tâm

  • @truongonghuy7471
    @truongonghuy7471 3 роки тому

    Ui vừa xem vừa sướng cả người :D cảm ơn anh

  • @musashi_hp
    @musashi_hp 3 роки тому

    anh dạy rất dễ hiểu và có tâm

  • @Black-zm4xj
    @Black-zm4xj 2 роки тому

    Khoá học free quá bổ ích, em học bên trung tâm còn dạy không kĩ bằng Anh.

  • @nguyenduongit
    @nguyenduongit Рік тому

    Lúc đầu học phần này còn mơ hồ lắm. Giờ làm mấy dự án gặp nó tự nhiên hiểu ra và thành thạo luôn 😅

  • @hoadoan3849
    @hoadoan3849 3 роки тому

    Cảm ơn anh, anh dạy học rất có tâm

  • @dongnguyenviet7796
    @dongnguyenviet7796 3 роки тому

    Rất dễ hiểu. Cảm ơn nhiều!

  • @learnwithme3364
    @learnwithme3364 Рік тому

    chất lượng quá a ạ.

  • @banghoang6301
    @banghoang6301 3 роки тому

    Cảm ơn Thầy Sơn rất nhiều I love you

  • @tringuyenhoang3266
    @tringuyenhoang3266 3 роки тому

    Thank bạn. Quá hay và dễ hiểu!!

  • @bh4541
    @bh4541 2 роки тому

    đó giờ mình chưa bao giờ nghĩ đồ free thì ngon hơn trả phí cả ,c ho tới khi mình gặp f8

  • @leo2_1
    @leo2_1 2 роки тому

    phải nói là cực dễ hiểu luôn

  • @NerdBigBird
    @NerdBigBird Рік тому

    Thích bài này nhất ❤

  • @HaNguyen-bq5fp
    @HaNguyen-bq5fp 2 роки тому

    cái này hay thật đấy a ạ, đỡ css thường nhiều

  • @cuocsongtaynguyen89
    @cuocsongtaynguyen89 3 роки тому

    Rất hay. Chân thành cảm ơn

  • @nguyenthanhbinh9598
    @nguyenthanhbinh9598 4 роки тому

    Bài này em thấy hay nhất trong các bài

  •  2 роки тому

    Cảm ơn anh Sơn nhiều lắm ạ

  • @quanwilliam8511
    @quanwilliam8511 2 роки тому

    cảm ơn anh ạ video rất hữu ích

  • @phieu3607
    @phieu3607 3 роки тому +6

    A ơi, e ngày nào cũng học ở kênh a, a cho e lời khuyên về học tiếng anh như thế nào với ạ, có cần phải pro ko a, hay chỉ học từ vựng chuyên dụng ngành thôi ạ

    • @DanhNgocSon--
      @DanhNgocSon-- Рік тому

      cần phải hỏi à bạn học ko bh là thừa

    • @TranNguyen-mv6ln
      @TranNguyen-mv6ln Рік тому

      Chỉ cần học từ chuyên ngành thôi bạn

    • @hoangQuan25
      @hoangQuan25 Рік тому

      Cứ học đi, tiếng anh bây giờ là kỹ năng bắt buộc phải có rồi, bh coi nó cần thiết như kiểu học đọc học viết chứ ko phải là 1 năng lực nữa.

  • @tunamusic2314
    @tunamusic2314 4 роки тому

    min-width : 740px độ dài tối thiểu của màn hình {}

  •  2 роки тому

    Video bài giảng trên channel này có gì khác với trên website admin nhỉ? Thấy giống nhau

  • @itngocuoc2781
    @itngocuoc2781 2 роки тому +1

    Mọi người ơi, cho mình hỏi tại sao mình đặt kích thước chỉ cho 1 flex-item thì không được ạ? VD: Ở khối column layout, mình muốn đặt cho phần tử ở giữa là 80%, thì mình chỉ CSS cho cột main-column là flex-basic: 80%, nhưng nó lại không cho kết quả như mong đợi là vì sao vậy ạ?

  • @buiviethoang5977
    @buiviethoang5977 4 роки тому

    Hay quá anh ơi

  • @Marcus369
    @Marcus369 2 роки тому

    Qúa chất lượng luôn

  • @TuNguyen-cj8oe
    @TuNguyen-cj8oe 3 місяці тому

    cảm mơn f8 nhiềuu

  • @tnln7893
    @tnln7893 4 роки тому

    Hay thật sự

  • @nguyenngocle6542
    @nguyenngocle6542 4 роки тому +1

    Khoá này hay cực

  • @BlueSky-lb7cp
    @BlueSky-lb7cp Рік тому

    Chỗ feature, form,center làm sao mình có được cái viền màu xám ở ngoài vậy ạ ?

  • @nganguyenbinh7735
    @nganguyenbinh7735 3 роки тому

    quá hay anh ạ

  • @tungkkaka8290
    @tungkkaka8290 3 роки тому

    hay quá a !

  • @QuanNguyen-nx9td
    @QuanNguyen-nx9td Рік тому

    làm hay lắm bạn ơi, cám ơn, mà sao không qua phần lan sống

  • @ngongocanh0512
    @ngongocanh0512 2 роки тому

    cái công cụ mà anh ấn vào syntax nó hiện ra những cái elements có thể chọn trên vscode là gì vậy ạ

  • @TheKing-tt6dg
    @TheKing-tt6dg 2 роки тому

    phần form layout em code giống vậy mà sao nó khác thế nhỉ - em không hiểu phần form tạo màu xám kiểu j - trong khi ở code anh không có tạo màu xám cho phần form đó

  • @DucLe-hc8kz
    @DucLe-hc8kz Рік тому +1

    hay 😀

  • @theanhnguyen17801
    @theanhnguyen17801 3 роки тому

    Mấy cái thầy dạy có giống reponsvi trong boostrap k thầy

  • @SơnThiên-d1r
    @SơnThiên-d1r 7 місяців тому

    2 thẻ form và label mấy bài trước anh chưa dạy làm phải tìm lú cái đầu mới hiểu đc :))

  • @chauchau3512
    @chauchau3512 3 роки тому

    anh ơi cho em hỏi là mình có nên dùng bootstrap thay thế cho css luôn được không ?

  • @congdatt
    @congdatt 3 роки тому

    hay tuyet anh oi

  • @hungtellus_MEP
    @hungtellus_MEP Рік тому

    Mình áp dụng để chỉnh trong thanh header của mình nhưng menu không thể cạnh giữa. Mình đang để là positive là relative và display là block. Khi đó padding là 0 10px và margin là 0. Thanh header có một logo bên góc trái. Bạn hướng dẫn dùm.

  • @binhngothanh7519
    @binhngothanh7519 Рік тому

    cách bỏ mấy cái dấu chấm ở thẻ li làm sao anh nhỉ, rồi ngay thẻ li là nó đã bị xuống dòng, làm sao để nó nằm ngang

    • @comwia
      @comwia Рік тому

      cậu css list-style: none; hoặc list-style-type: none; là bỏ được dấu chấm trước thẻ li

  • @nguyenquochuy1270
    @nguyenquochuy1270 4 роки тому

    hay quá a ơi

  • @hoangh.8887
    @hoangh.8887 2 роки тому

    Anh ơi mỗi lần em refesh nó lại load lại từ đàu web làm thế nào để refesh mà nó vẫn ở chỗ mình vừa kéo đến anh ?

  • @HienNguyen-vf7jw
    @HienNguyen-vf7jw 2 роки тому

    Tại sao video này anh không thiết kế rồi code từ đầu ạ chứ có nhiều chỗ thêm html nó chưa có cái cơ bản hơi khó theo ạ?

  • @hoangv5282
    @hoangv5282 4 роки тому +1

    28:22 em dùng flex-wrap: wrap; được không ạ?

  • @builinh4223
    @builinh4223 2 роки тому

    đoạn keyframes mình ko code được ra giống video nhỉ

  • @Bieno-pb7lo
    @Bieno-pb7lo Рік тому

    align-content với align-item khác nhau những điểm gì anh nhỉ?

  • @tanlucnguyen9778
    @tanlucnguyen9778 2 роки тому

    anh cho em hỏi giũa float vs flex box thì cái nào dc dùng nhiều hơn vậy

    • @F8VNOfficial
      @F8VNOfficial  2 роки тому +1

      Flexbox dùng phổ biến em nhé, float gần như ko xài nữa

  • @NgocNguyen-gb9ev
    @NgocNguyen-gb9ev 2 роки тому

    tự dưng đến đoạn Feature-layout CSS mãi mà nó không chịu lên thành hàng ngang mặc dù đã kiểm tra viết giống hệt ad rồi😂

  • @quannguyen3840
    @quannguyen3840 4 роки тому

    anh ơi cái tool lúc a cắt lấy trị số width với height là gì ý ạ

  • @trongtruong112
    @trongtruong112 4 роки тому

    a cho em hỏi là visual studio code anh dùng font gì vậy ạ?

  • @thealoner3183
    @thealoner3183 2 роки тому

    Hơi buồn là f8 xếp nó lộn xộn quá phải vào đây học

  • @inhsyduyetkenh5730
    @inhsyduyetkenh5730 3 роки тому

    Em hay set cứng width và height cho toàn bộ div trong html . Liệu có đúng ko anh ?

  • @trantuanat524
    @trantuanat524 4 роки тому

    sao em học đến đoạn này cảm tháy hơi khó hiểu vậy nhỉ, có phải do video thứ 32 bị xóa nên vậy không ạ ?

  • @dcmessitinh5854
    @dcmessitinh5854 3 роки тому

    2:07 sao ngay từ đầu list nó đã nằm ngang r nhỉ. tưởng 1 thẻ ul thì các phần tử trong danh sách hiển thị theo chiều dọc chứ nhỉ

    • @dcmessitinh5854
      @dcmessitinh5854 3 роки тому

      à, do .nav-item của a này là inline . nó phải áp dụng cho từng cá nhân item, chứ k dùng cho ul

  • @nhan88vlog
    @nhan88vlog 2 роки тому

    Mình hỏi chút addon dùng ở 14:28 là gì vậy? Cảm ơn

  • @tinhtranquoc6625
    @tinhtranquoc6625 4 роки тому

    hay quá a

  • @amanda2348-g9j
    @amanda2348-g9j 2 роки тому

    13:02 cái này không dùng flex basis mà dùng width thì khác gì ko anh?

  • @nghienreviewphim6789
    @nghienreviewphim6789 2 роки тому

    cái phần biểu đồ. sao e làm height:var(--percent) mà nó không nhận chiều cao nhỉ? AI biết chỉ e với

  • @SangNguyen-zk2rz
    @SangNguyen-zk2rz 4 роки тому

    a ơi vậy cái display: flex để làm gì vậy, khi em bỏ cái đó đi cho flex: 1 thôi thì thanh trống nó không dài ra, có display: flex thì thanh nó mới dài ra. Anh cho em hỏi tại sao ạ

  • @TungPham-dt6tr
    @TungPham-dt6tr 2 роки тому

    cho em hỏi chút là max-width, min-width nó khác gì width bình thường ạ

  • @huylenguyentruong5232
    @huylenguyentruong5232 3 роки тому

    Chắc best Evelynn đây rồi :))

  • @itngocuoc2781
    @itngocuoc2781 2 роки тому

    Tại sao Flex-shrink và flex-grow lại có thể viết tắt chung với nhau được nhỉ? VD: Nếu đặt flex: 3 2 , thì có nghĩa là giãn 3 lần và co 2 lần hả mn? Thắc mắc quá ae giải đáp giúp mình với ạ :(((

  • @hoangphihung1526
    @hoangphihung1526 3 роки тому

    Cho mình hỏi max-width có tác dụng gì ko ạ
    mình thấy nó chả khác width gì cả