Open cssmagic opened 8 years ago
前言 新一期的 “快问快答” 又跟大家见面了。魔法哥会在这个栏目中回答具有普遍性的网友提问，希望这些问答对你也有启发；如果你也想提问，直接在 “CSS魔法” 微信公众号内留言就可以了。 以下是 “快问快答” 第二期的问答精选。
新一期的 “快问快答” 又跟大家见面了。魔法哥会在这个栏目中回答具有普遍性的网友提问，希望这些问答对你也有启发；如果你也想提问，直接在 “CSS魔法” 微信公众号内留言就可以了。
以下是 “快问快答” 第二期的问答精选。
微信网友 山人 提问：
魔法哥，我们的 CTO 想让我来主导公司平台的一个重构，让我给个技术方案。我初步的计划是不采取前后端分离的方式，因为前只有一个前端工程师，而且时间也是比较急。同时我也想了，就用 Gulp + RequireJS + jQuery + 自己原有的一些通用插件，因为能力只达到这个水平。现在就是我不是特别熟悉 Gulp 去构建基本的一个项目结构。我看了你公众号里的几篇文章，仍然不是特别明白，能不能再出一版比较详细完整而且还很通用的文章来分享看看？能带上源码是最好的了。
你的选择是合理的。选择适合自己团队的方案就好，不用赶时髦。
至于 Gulp，它只是用来管理构建任务——你需要什么任务，直接写出来就好了。Gulp 其实不会决定你的项目结构，而是你的技术选项决定了会有哪些 Gulp 构建任务。
关于代码示例，目前只有我写的几个开源项目（github.com/cssmagic）里面的 gulpfile 了。基本上还是用 Gulp 3 写的，比较简单，不一定对你有帮助。另外我确实打算写一篇 Gulp 4 实践指南，请继续关注公众号吧！
微博网友 和薛之谦有关的昵称 提问：
你好，我想请教一个问题，怎样改变 radio 圆点的颜色？
对于 <input type="radio"> 标签生成的单选框，它的样式通常是跟着系统主题走的。也就是说，在绝大多数浏览器中，这个控件并不是由浏览器自己绘制出来的。因此，浏览器往往只允许 CSS 控制它的尺寸，不允许改变它的样式。
<input type="radio">
在实践中，我们往往通过一些变通的方法来实现自定义外观的单选框。其中最为推荐的方案详见《CSS 揭秘》这本书第 149 页的 “自定义复选框” 一节。
微博网友 黑子哲** 提问：
我开发响应式网站不想用框架，能用弹性布局 flex 写吗？还是用 flex 结合 Media Query 来写响应式？
建议以 flexbox 布局为主（用 flex-grow 或百分比来控制宽度），以 Media Query 为辅。更多细节可以参考《CSS 揭秘》这本书第 11 页的 “关于响应式网页设计” 段落。
flex-grow
另外建议在使用 flexbox 时留意浏览器兼容性。
知乎网友 大馒** 提问：
对于非 CSS3 的书籍，还有必要阅读吗？
有必要。
简单来说，“CSS 3” 规范是在 CSS 2 的基础之上扩展而来的，并不是凭空另起一套；而且市面上以 “CSS 3” 为卖点的图书由于篇幅的限制，往往不会重复讲解 CSS 2 的内容。
更详细的解释可以参考《图灵访谈 CSS魔法：学海无涯，而吾生有涯》这篇文章。
微信网友 mine 提问：
请问学习 Bootstrap 什么书籍比较好？看官网感觉不详细，没法系统地进行合理架构。
我感觉官方文档足够了。我买过一本书叫《Bootstrap 用户手册》，但感觉并不比官方文档更好 😂（原以为书里会介绍设计思想和开发经验，可惜并没有找到）。我建议你自己找个比较典型的页面，尝试用 Bootstrap 提供的组件拼装出来，写过几个页面之后就会有感觉了。
微信网友 DJL箫氏 提问：
魔法哥，能把你写的 CSS 的代码给我看看吗，想知道你是怎么写的。
好的，最近在写 CMUI v2.0，回头把链接发给你参考一下。
不过 CMUI 是 CSS 框架，并不是业务代码，不一定是你想看的类型。关于如何用 CSS 写页面…………
……
完整文章已收录到 “CSS魔法” 微信公众号，扫码立即订阅：
© Creative Commons BY-NC-ND 4.0 | 我要订阅 | 我要打赏
mark，沙发已占 :+1:
xCss
commented
8 years ago xCss
commented
8 years ago
快问快答（第二期）
技术答疑
Q
微信网友 山人 提问：
A
你的选择是合理的。选择适合自己团队的方案就好，不用赶时髦。
至于 Gulp，它只是用来管理构建任务——你需要什么任务，直接写出来就好了。Gulp 其实不会决定你的项目结构，而是你的技术选项决定了会有哪些 Gulp 构建任务。
关于代码示例，目前只有我写的几个开源项目（github.com/cssmagic）里面的 gulpfile 了。基本上还是用 Gulp 3 写的，比较简单，不一定对你有帮助。另外我确实打算写一篇 Gulp 4 实践指南，请继续关注公众号吧！
Q
微博网友 和薛之谦有关的昵称 提问：
A
对于
<input type="radio">标签生成的单选框，它的样式通常是跟着系统主题走的。也就是说，在绝大多数浏览器中，这个控件并不是由浏览器自己绘制出来的。因此，浏览器往往只允许 CSS 控制它的尺寸，不允许改变它的样式。在实践中，我们往往通过一些变通的方法来实现自定义外观的单选框。其中最为推荐的方案详见《CSS 揭秘》这本书第 149 页的 “自定义复选框” 一节。
Q
微博网友 黑子哲** 提问：
A
建议以 flexbox 布局为主（用
flex-grow或百分比来控制宽度），以 Media Query 为辅。更多细节可以参考《CSS 揭秘》这本书第 11 页的 “关于响应式网页设计” 段落。另外建议在使用 flexbox 时留意浏览器兼容性。
前端学习建议
Q
知乎网友 大馒** 提问：
A
有必要。
简单来说，“CSS 3” 规范是在 CSS 2 的基础之上扩展而来的，并不是凭空另起一套；而且市面上以 “CSS 3” 为卖点的图书由于篇幅的限制，往往不会重复讲解 CSS 2 的内容。
更详细的解释可以参考《图灵访谈 CSS魔法：学海无涯，而吾生有涯》这篇文章。
Q
微信网友 mine 提问：
A
我感觉官方文档足够了。我买过一本书叫《Bootstrap 用户手册》，但感觉并不比官方文档更好 😂（原以为书里会介绍设计思想和开发经验，可惜并没有找到）。我建议你自己找个比较典型的页面，尝试用 Bootstrap 提供的组件拼装出来，写过几个页面之后就会有感觉了。
Q
微信网友 DJL箫氏 提问：
好的，最近在写 CMUI v2.0，回头把链接发给你参考一下。
不过 CMUI 是 CSS 框架，并不是业务代码，不一定是你想看的类型。关于如何用 CSS 写页面…………
……
……
© Creative Commons BY-NC-ND 4.0 | 我要订阅 | 我要打赏