使用CSS Grid的九大误区

特别声明:本站已开启付费阅读,年费会员价 ¥365.00元。如果您喜欢小站的内容,可以点击开通会员进行全站阅读。如果您对付费阅读有任何建议或想法,欢迎发送邮件至: airenliao@gmail.com!(^_^)

如果你和我一样一直在关注CSS Grid布局的话,你应该知道@Rachel Andrew和@Jen Simmons都是CSS Grid 布局的布道师。两位女士一直都在推进Grid的特性和完善相关的特性。这几天看到@Jen Simmons录了一个视频,聊了一下CSS Grid布局相关的误区。

前言

在Web世界中,大家都知道,使用任何一项新技术都易于犯错,特别是像CSS Grid这样的与过去有很大变化的东西。初学者或者有一定经验的Web开发人员,都无法一时之间就能把控所有。@Jen Simmons录制了一个视频,向大家阐述了使用CSS Grid的九大误区,也是使用CSS Grid布局易犯的错误,并且在视频中提出了一些相关的建议,让大家在使用CSS Grid布局的时候能尽量的避免这些误区,甚至可以帮助一些同学改掉一些旧习惯。

如果你英文够好,建议先直接观看下面这段视频。接下来的视频都来自于@Jen Simmons录制的视频,都放置在Youtube网站上的免费视频。不过需要正常观后的话,需要自备天梯。

接下来简单的看看这九个误区,以及相对应的一些资源,希望接下来的内容能更好的帮助大家理解这几个误区,以及增强这方面的知识点,更好的避开这些误区。

误区一:认为CSS Grid就是神

在《CSS布局指南》一文中已经提到过,对于Web的布局,它将是一个永恒的话题。如果你对布局相关的知识有所了解,你应该知道,在CSS Grid出来之前,所有的布局方案都是针对的。直到CSS Grid出来之后,才有了二维的布局。就在此时,CSS Grid布局能解决很多以前一直无法解决的布局方案。

就因为CSS Grid布局具有二维布局特性,造成了大家对CSS Grid的第一个误区:认为CSS Grid布局就是一神器,无所不能。事实上,这是一种对CSS Grid认识的误区。虽然CSS Grid布局能实现大部分的Web布局,但并不代表所有的布局都应该用CSS Grid来实现。正确的做法是:

在适当的项目采用适当的布局方案。

也因为这个误区,社区对这个现象有过很多的讨论,比如“Flexbox和Grid布局,哪个更好?”:

有关于这方面的讨论还可以阅读:

正因为这样的讨论,在社区有一个共识。在Web布局当中,我们应该根据实际情况:Flexbox和Grid布局结合在一起使用

剩余80%内容付费后可查看
* 请输入阅读码(忘记阅读码?

如需转载,烦请注明出处:https://www.w3cplus.com/css/9-biggest-mistakes-with-css-grid.html

如果文章中有不对之处,烦请各位大神拍正。如果你觉得这篇文章对你有所帮助,打个赏,让我有更大的动力去创作。(^_^)。看完了?还不过瘾?点击向作者提问!

赏杯咖啡,鼓励他创作更多优质内容!
返回顶部