切图仔的一点工作经验

Karuru 发布于2019-08-29 11:29 / 1712人阅读

摘要：切图仔的一点工作经验磨刀不误砍柴功一个趁手的编辑器比如自己调教好的或如，可以极大的提高自己的工作效率。如果美工做图的时候能把什么命名字体行距内外边距标注清楚，能省切图仔多少事编写先创建好模板，常用的标签重置这些先带上。

blog

切图仔的一点工作经验 0 磨刀不误砍柴功

一个趁手的编辑器（比如自己调教好的st3）或IDE（如Hbuilder、webstorm），可以极大的提高自己的工作效率。

调试功能强大、实现规范标准的浏览器（Chrome！）。

明确浏览器兼容要求，能用啥该用啥想想清楚。

一台足够快的电脑。

多学多做，代码基础扎实。

1 PSD到手之后

从美工那拿到PSD文件后，先别急着敲，仔细看一遍，想想html结构该怎么建，哪些元素可以重用，一些效果该怎么实现。

如果美工做图的时候能把什么命名字体行距内外边距标注清楚，能省切图仔多少事

2 编写HTML

先创建好模板，常用的meta标签、重置css这些先带上。

接下来写页面的框架，定好几个大的区块，往里面填具体的结构，注意结构要清晰明确语义化。

3 编写CSS 类名

我个人倾向于BEM命名法，当然，我现在水平不够，不太纯

写css的时候，靠着IDE智能提示，那感觉，特爽！

伪元素

装饰性元素可以尽量用伪元素来实现，什么小图标小线段序号（使用css计数器）之类的东西，可以有效减小HTML文档的复杂度。

杂七杂八的一些技巧 高宽不定死

减少计算量，方便更改

少用浮动

如果不是非要兼容IE7，那使用inline-block可以替掉很多需要使用float的场景。

少用浮动，那由浮动引起的一些问题也就没有了，像什么破坏DOM流。

必要的回退

/*先写回退，再写高级样式*/
background-color: #fff;
background-color: rgba(256, 256, 256, 0.48);

使用高级选择器

很多情况下都不用js啦！

慢慢补充 结尾

GPU云服务器云服务器切图仔工作经验 java工作经验简历人工智能的一天

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/111679.html

切图仔的一点工作经验

摘要：切图仔的一点工作经验磨刀不误砍柴功一个趁手的编辑器比如自己调教好的或如，可以极大的提高自己的工作效率。如果美工做图的时候能把什么命名字体行距内外边距标注清楚，能省切图仔多少事编写先创建好模板，常用的标签重置这些先带上。 blog 切图仔的一点工作经验 0 磨刀不误砍柴功一个趁手的编辑器（比如自己调教好的st3）或IDE（如Hbuilder、webstorm），可以极大的提高自己的工作...

godlong_X 2019-08-01 15:51 评论0 收藏0
切图仔的 Nginx 小书?

摘要：切图仔的小书本文陆续介绍的功能配置及一些实用场景待完善。更可贵的是配置简单文档丰富大大降低了学习的门槛。为什么选择自年发布以来，一直是服务器市场的霸主。虽然发布较晚，但是却因为在高并发下卓越的表现而迅速崭露头角。切图仔的 Nginx 小书本文陆续介绍 Nginx 的功能、配置、及一些实用场景（待完善...）。一、介绍 Nginx 1. Nginx 是什么？ Nginx，很多工程师...

pubdreamcc 2019-07-25 14:06 评论0 收藏0
切图仔的 Nginx 小书?

摘要：切图仔的小书本文陆续介绍的功能配置及一些实用场景待完善。更可贵的是配置简单文档丰富大大降低了学习的门槛。为什么选择自年发布以来，一直是服务器市场的霸主。虽然发布较晚，但是却因为在高并发下卓越的表现而迅速崭露头角。切图仔的 Nginx 小书本文陆续介绍 Nginx 的功能、配置、及一些实用场景（待完善...）。一、介绍 Nginx 1. Nginx 是什么？ Nginx，很多工程师...

mrli2016 2019-07-24 10:41 评论0 收藏0
FEer到全栈开发

摘要：代码开发记得曾经听开发平台的同学骄傲的讲，中只有百度有全公司级别的统一代码仓库，并且使用管理代码，不明觉厉，我也很骄傲。前言从前，一个类B/S架构的应用里，FEer，或者叫切图仔，切图+表单验证就是工作的全部。无奈我所做的全部，只是整个应用的冰山一角...责任小了，边缘感就强了，owner意识自然差，视野自然受限。感谢V8引擎的极速体验&chrome浏览器的紧随规范，js执行速度...

elina 2019-08-20 18:14 评论0 收藏0