微信号:cssmagic_wx

介绍:前端进阶,你我同行.每天迈出一小步,不断收获新技能!

快问快答(第二期)

2016-08-29 06:08 ·

前言

新一期的 “快问快答” 又跟大家见面了。魔法哥会在这个栏目中回答具有普遍性的网友提问,希望这些问答对你也有启发;如果你也想提问,直接在 “CSS魔法” 微信公众号内留言就可以了。

技术答疑

Q 微信网友 山人 提问:

魔法哥,我们的 CTO 想让我来主导公司平台的一个重构,让我给个技术方案。我初步的计划是不采取前后端分离的方式,因为前只有一个前端工程师,而且时间也是比较急。同时我也想了,就用 Gulp + RequireJS + jQuery + 自己原有的一些通用插件,因为能力只达到这个水平。现在就是我不是特别熟悉 Gulp 去构建基本的一个项目结构。我看了你公众号里的几篇文章,仍然不是特别明白,能不能再出一版比较详细完整而且还很通用的文章来分享看看?能带上源码是最好的了。

A 你的选择是合理的。选择适合自己团队的方案就好,不用赶时髦。

至于 Gulp,它只是用来管理构建任务——你需要什么任务,直接写出来就好了。Gulp 其实不会决定你的项目结构,而是你的技术选项决定了会有哪些 Gulp 构建任务。

关于代码示例,目前只有我写的几个开源项目(github.com/cssmagic)里面的 gulpfile 了。基本上还是用 Gulp 3 写的,比较简单,不一定对你有帮助。另外我确实打算写一篇 Gulp 4 实践指南,请继续关注公众号吧!

Q 微博网友 和薛之谦有关的昵称 提问:

你好,我想请教一个问题,怎样改变 radio 圆点的颜色?

A 对于 <input type="radio"> 标签生成的单选框,它的样式通常是跟着系统主题走的。也就是说,在绝大多数浏览器中,这个控件并不是由浏览器自己绘制出来的。因此,浏览器往往只允许 CSS 控制它的尺寸,不允许改变它的样式。

在实践中,我们往往通过一些变通的方法来实现自定义外观的单选框。其中最为推荐的方案详见《CSS 揭秘》这本书第 149 页的 “自定义复选框” 一节。

Q 微博网友 黑子哲** 提问:

我开发响应式网站不想用框架,能用弹性布局 flex 写吗?还是用 flex 结合 Media Query 来写响应式?

A 建议以 flexbox 布局为主(用 flex-grow 或百分比来控制宽度),以 Media Query 为辅。更多细节可以参考《CSS 揭秘》这本书第 11 页的 “关于响应式网页设计” 段落。

另外建议在使用 flexbox 时留意浏览器兼容性。

前端学习建议

Q 知乎网友 大馒** 提问:

对于非 CSS3 的书籍,还有必要阅读吗?

A 有必要。

简单来说,“CSS 3” 规范是在 CSS 2 的基础之上扩展而来的,并不是凭空另起一套;而且市面上以 “CSS 3” 为卖点的图书由于篇幅的限制,往往不会重复讲解 CSS 2 的内容。

更详细的解释可以参考《图灵访谈 CSS魔法:学海无涯,而吾生有涯》这篇文章。

Q 微信网友 mine 提问:

请问学习 Bootstrap 什么书籍比较好?看官网感觉不详细,没法系统地进行合理架构。

A 我感觉官方文档足够了。我买过一本书叫《Bootstrap 用户手册》,但感觉并不比官方文档更好 😂(原以为书里会介绍设计思想和开发经验,可惜并没有找到)。我建议你自己找个比较典型的页面,尝试用 Bootstrap 提供的组件拼装出来,写过几个页面之后就会有感觉了。

Q 微信网友 DJL箫氏 提问:

魔法哥,能把你写的 CSS 的代码给我看看吗,想知道你是怎么写的。

好的,最近在写 CMUI v2.0,回头把链接发给你参考一下。

不过 CMUI 是 CSS 框架,并不是业务代码,不一定是你想看的类型。关于如何用 CSS 写页面,我会专门制作教程的,请继续关注 “CSS魔法” 微信公众号哦!

Q 微信网友 中原 提问:

我最近在读您翻译的《CSS 揭秘》这本书,很有兴趣,也学到了很多东西。但感觉这本书是由一个一个的知识点组成的,并不系统,不知道是不是我的学习姿势不对,想请您给些建议。

A 我在去年的 CSS Conf 上向大家推荐这本书时,就强调了这本书是进阶教程,并不适合 CSS 初学者。因此我当时还推荐了另外两本书:《CSS 权威指南》和《精通 CSS》。

这两本书搭配着读,可以帮助初学者建立起系统的 CSS 知识体系。建议看完这两本书并且有了一定的实践经验之后,再来阅读《CSS 揭秘》。

Q 微博网友 miss-wrak**沙漠小** 提问:

魔法哥,推荐一本适合初学者学习 CSS 的书可以么?

A 参见上一个问题。如果必须限死一本,那就《精通 CSS》吧。

(题图作者:Karen Eliot @ Flickr)

 
CSS魔法 更多文章 快问快答(第一期) StuQ 专访:CSS魔法畅聊前端人生 如何正确书写回退样式
猜您喜欢 Android关于Dex拆分(MultiDex)技术详解 在食堂吃个饭,竟然会发生这样的事...... Using Swift with Cocoa and Objective-C--利用现有ObjC类及框架资源编写Swif