CSS Grid cho người mới toàn tập phần 3

CSS Grid cho người mới toàn tập phần 3
🔥 Tham khảo khoá học HTML CSS cơ bản của mình: evondev.com/kh...
🔥 Tham khảo khoá học HTML CSS nâng cao của mình: evondev.com/kh...
🔥 Tham khảo khoá học Javscript cơ bản của mình: evondev.com/kh...
👉 Kết nối với mình
🚀Fanpage: / evondevblog
🚀Facebook: / tuan.trananh.0509
🚀Blog: evondev.com
🚀Nhóm của mình: / 2565163230401512
🚀Học online với mình: / tuan.trananh.0509
👉 Theme: Evondev Dracula
👉 Font chữ: SF Mono, 14px
👉 Extension VSCode: Evondev Dracula, Evondev Snippets, Prettier, Material Icon, Highlight Matching Tag, Bracket Pair Colorizer, HTML Snippets, Live Server, Live Server Preview
👉 Extension Chrome: Eye Dropper color picker Chrome Extension, color slurp MacOS, visBug Chrome Extension
👉Source code tại đây: github.com/evo...
👉Extension gõ pháo hoa: Powermode

[@tontanit]

Cảm ơn bạn đã chia sẽ CSS Grid... rất hay, Thank

[@pattlactroi4279]

video best chất lượng❤. Quá nhiệt tình, dễ hiểu, kiến thức rộng, giọng dễ nghe. Tuyệt vời. Chúc anh nhiều sức khỏe. i has been subcribe your chanel🥰

[@sontramai8108]

Video rất hay và dễ hiểu ạ

[@evondevfrontend]

Cám ơn nà

[@rian33217]

coi blog của của anh đó giờ mới biết là anh có kênh riêng. Thanks nhiều nha

[@nhattranminh7814]

Video rất đầu tư

[@otuyen9495]

Cảm ơn anh!

[@nguyentrunghieu2772]

Quá tuyệt vời anh ơi!

[@minhnguyenkha867]

Mình cũng đang cần.... tks ad

[@giahuyletran7622]

Tuyệt lắm anh ơi.

[@HuyLe-xj6yl]

anh Tuấn bữa nào rảnh anh làm về cách sử dụng visBug đi anh?, em mới thấy mấy bn comment nên mới tìm hiểu, hay ghê :)

[@trinhthongtin477]

Hay quá anh

[@linhhuynhnguyenkhanh4147]

Em xin tên tool anh sử dụng để đo height với weight ạ

[@igdev6095]

Khi nào chia sẻ về mấy breakpoint a hay dùng để responsive đi a 🍔

[@quacquac_quacquac]

Dạ em cảm ơn 🥰🥰

[@quacquac_quacquac]

@@evondevfrontend Hoạt động khắp mọi nơi 😂

[@KhangNguyen-kq2iw]

Đỉnh thật sự luôn a ơi

[@thangpham-mp4fg]

Tuyệt quá anh ơi ❤️

[@katusngo3451]

Bài này hay quá anh ạ. Cho em hỏi thằng scroll-snap có bắt buộc phải dùng với display: grid không anh?

[@Tranminhhien2003]

anh gì ơi, anh cho em hỏi ở grid-template-column :repeat (4, 1fr); thì 1fr là gì vậy anh

[@hiepnguyen3494]

Theo quan điểm cá nhân và kinh nghiệm của mình các bạn mới chỉ nên sử dụng display: grid; để tham khảo. Chỉ cần thành thạo flex đã là khá ngon rồi, bản chất grid ko support khá nhiều browser. Một số thị trường đặc thù như Nhật họ dùng cả IE và Opera thì việc đi sửa lại rất nhọc.

[@haido9420]

.

[@haido9420]

.

[@TungNguyen-yx7vr]

Tại grid chưa dc sử dụng nhiều đâu, nếu nó dc sử dụng còn tiện lợi hơn cả flexbox

[@maicaotri3668]

Anh thêm chữ và tạo slider ảnh vào tiêu đề video cho dễ tìm đi anh

[@tatrunghieu7189]

cho em hỏi anh cài extension gì trên chrome ra cái khung màn hình điện thoại vậy ạ?

[@thanhlamho9943]

Mình nghĩ có thể dùng grid-area để giải quyết bài toán, tuy nhiên nó không được linh động và phức tạp hơn

[@longnguyenthanh4474]

Video rất bổ ích, mình muốn hỏi thêm một chút: Lúc mà kéo nhỏ màn hình để nó chia 8 item thành 3 dòng ấy Dòng 1: 3 item Dòng 2: 3 item Dòng 3: 2 item Dòng thứ 3 muốn cho 2 item căn giữa màn hình thay vì từ trái qua, nghĩa là nếu không đủ item để fit đủ màn hình thì nó sẽ căn giữa thì có cách nào để làm ko?

[@longnguyenthanh4474]

@@evondevfrontend Bạn có video nào có nội dung như vậy ko ạ ? Cho mình xin link, mình muốn học hỏi thêm

[@meanime1715]

Tìm ra cách chưa bạn

[@longnguyenthanh4474]

@@meanime1715 Chuyển qua dùng Flex bạn ơi, Grid hơi phức tạp trong case này

[@meanime1715]

@@longnguyenthanh4474 cảm ơn bạn

[@maicaotri3668]

đỉnh vãi nồi ạ 😍

[@HieuNguyen-ml6xq]

Cho em xin info cái ext đo kích thước với ạ. Em cảm ơn nhiều

[@becauseimthebest7284]

Hay quá anh ơi. Mà cho em hỏi anh dùng tool gì trên chrome mà nó hiện ra tag với mấy cái khoảng cách vậy anh. Cám ơn anh nhiều

[@studyandentertainment581]

font chữ a dùng ở vscode là gì thế ạ

[@anhlt]

Hi bạn, cho mình hỏi cái extesion để đo khoảng cách là gì đó ạ 06:46 Thanks

[@anhlt]

@@evondevfrontend Thanks bạn :)

[@TamNguyen-uu2sr]

a cho em hỏi để code mấy cái hiệu ứng Animations thì nên vào đâu để xem, a có thể chỉ cho e vài nơi để xem được ko

[@evondevfrontend]

Tìm mấy trang về loader là có nhiều lắm em

[@TamNguyen-uu2sr]

@@evondevfrontend a có thể chỉ cho e 1 trang nào a hay dùng được ko a

[@VuNguyen-zr1mn]

Cho e hỏi cái grid này đc hỗ trợ nhiều trình duyệt chưa ạ

[@evondevfrontend]

Rùi nè

[@khanhnguyentien9373]

Cho em hỏi anh dùng công cụ gì để đo trong video thế ạ? 😀😀😀

[@thanhlamho9943]

Cùng câu hỏi

[@anhtuan2288]

CÙng câu hỏi, mong anh trả lời

[@anlam6759]

visBug

[@khanhnguyentien9373]

Em cảm ơn a

[@anhtuan2288]

em cam on a

[@lamtruongthanh4873]

anh ơi có thể chỉ em làm cho nó chạy ok trên safari không ạ.. e làm như anh các Browser khác đều ổn, test trên safari không chạy được grid..

[@evondevfrontend]

safari cũ không chạy được đâu em

[@moviemadlife4089]

anh ơi làm sao để đc con trỏ chuột màu hồng và đẹp như anh vậy

[@phamviethoang2667]

Anh ơi em làm giống như anh nhưng khi co màn hình lại thì ảnh lại không nhảy xuống dưới ạ. Như vậy là bị sao vậy ạ?

[@TuanNguyenVan-hm5oz]

a dùng extensions gì để nhắc code css khi responsive vậy a

[@evondevfrontend]

Nhắc code thì vscode có sẵn á em

[@developer276]

scroll snap áp dụng dc cả flex và grid luôn hả anh

[@lwind07]

Anh có nhận đệ không anh ơi

[@gunk2991]

sao chỗ nút phách lúc code có hiệu ứng vậy anh

[@nguyenang8130]

A cho em xin tên extension đo khoảng cách các element với ạ. e cảm ơn

[@evondevfrontend]

visBug, pageRuler Redux

[@thaianghung8005]

Anh cho em xin cách sử dụng để xóa scrollbar khi overflow-x/y với ạ

[@thaianghung8005]

@@evondevfrontend Cảm ơn anh nha

[@nguyenvanhung8560]

dạ anh ơi , sao e cũng làm giống anh mà lúc thu nhỏ nó k rớt xuống hàng a nhỉ,lúc em f12 r em chỉnh qua mobile thì nó k rớt xuống,mà e thu nhở trình duyệt thì lại dc,lí do gì v anh

[@evondevfrontend]

em mới học thì nên tìm hiểu về responsive trước, rồi học flexbox đã rồi tới css grid các phần trước cho ổn rồi coi cái này nha em

[@nguyenvanhung8560]

@@evondevfrontend e coi hết các phần đó của a r ạ

[@nguyenvanhung8560]

@@evondevfrontend e chỉ thắc mắc sao thu nhỏ cái browser e đang chạy thì nó rớt, r e thử check lại bằng cách f12 mà ko đc nên e mới hỏi a ạ

[@evondevfrontend]

@@nguyenvanhung8560 chắc em thiếu meta viewport

[@nghiaphuoc4844]

chết dồi, phải đăng kí kênh thôi :D

[@DuyDuy-zd1cn]

6:43 cho em xin tên extension đo khoảng cách các element với anh

[@atnguyen5240]

visbug

[@09-buihaihiep88]

Em không dùng được cái grip gap là sao ạ

[@evondevfrontend]

chắc trình duyệt chưa hỗ trợ đó

[@haituan6462]

a cho e hỏi khác nhau giữa grid-template-clumns và dùng grid-auto-flow: columns với ạ? e làm theo video thì dùng cả 2 đều kết quả như nhau

[@haituan6462]

@@evondevfrontend vâng cảm ơn a ạ

[@vanminh8430]

"Chặp nữa" hay là "tí nữa " z a ơi :)))