CSS学习中的瓶颈期深入分析

2020-04-27 07:49:51易采站长站整理

问题1, 2表示“深入的细节掌握”;3, 4表示“深入的机制理解”。再往后可能就是“网页大事,为我所控”,“天下页面,听我号令”,这要C阶段了,先不予讨论。

换句话说,您现在的瓶颈可能在于“细节掌握不够”、“机制等理解不够”。

关于细节
有人可能会反问:我为什么要知道dl, dd, dt标签默认的margin值大小?我一般都是直接在CSS reset中设置:

body,h1,... ,dl,dt,dd,...,th,td { margin:0; padding: 0; }

你看,淘宝网首页就是这么干的(global-min.css)!从实际应用来看,我无需关心!

这样的想法,类似于:我根本不需要知道我的前任、现任、后任女友是否是处女,因为我都直接让她们做处女膜修复!从实际应用来看,我无需关心!

很多事情,如果你足够了解之,就能灵活掌控之!即所谓的驾驭能力。CSS细节了解,有助于你更好地驾驭CSS, 而不是被CSS调试,被浏览器劫持。

3~4两的大闸蟹虽然也有人要,但是,多啊,不值几个钱;但是半斤以上的大闸蟹的单价就要翻番。
盲从CSS reset的人也有人要,但是,多啊,不值几个钱;但是,知根究底的人这身价就要翻番了。

如果你有自己想法,知根知底,你可能就是这样做reset的:

body, h1, ..., dl, dd { margin: 0; }

dt
标签的reset只是白白浪费,增加页面渲染负荷;
padding
属性值仅极少标签(
ol
,
ul
)有,其他标签无需浪费渲染重新设置。
//zxx: 对于淘宝首页的渲染速度我就不说什么了

有不少人曾问我:“你的那个CSS架构我用了,很不错,使用很方便。但是,我经常CSS库的类名有5个甚至更多!而你写的页面很少会这样,为什么呢?”

<span class="db l h24 lh24 b">注意:</span>我是……

如果你对CSS细节足够掌握,可能您的使用就会是这样:

<strong class="l lh24">注意:</strong>我是……

这就是我说过的,如果页面开发工程师对CSS属性理解不够透彻,我的这种架构对其而言反而会略显吃力!

关于理解
你是否有这样的调试经历:尼玛IE(x)浏览器下出了个奇怪问题,哥哥我不知道原因啊原因啊原因,然后很苦逼地把觉得有可能的CSS属性一个一个试验——改一个刷一下,看看有没有变好。

唉,可怜的娃,宝贵的青春就这么蹉跎掉了,省下来和前台美女MM调调情也比这强多了~~