Fe

《你真的会切图吗》 切图概念 前端职责 与产品经理和交互、视觉设计师协作，根据需求文档、线框图、设计稿完成页面制作（切图部分）； 与后台工程师协作，完成数据交互、动态信息展现和用户的互动 切图定义 设计思路的理解和还原 页面模块化制作的预演 切图理论储备 常见图片格式 设备像素比 devicePixelRatio = 物理像素 / dips(device-independent像素，设备无关的像素)，常见@1x，@2x，@3x 切图实践要领 心中有数 需求定位、结果模块、资源细分、 疑难杂症 大刀阔斧 工欲善其事，必先利其器：硬件舍得、软件恰当、工具够用 图层的合理运用：选择、分组、复制 精雕细磨 压缩图片体积、图片大小范围、仿色杂边处理、雪碧图合并 simple than simple 不切图、让他人切图、自动化切图 《HTML构建之法》 HTML释义 HTML与XHTML、结构与表现分离、使用语义化标签 语义化 What：用合理的HTML标签标记相应的内容。 Why：可用性、易用性、可维护、SEO等 How：认识HTML标签、理解标签的意义 HTML5 新特性 Canvas 元素 Video 、 Audio 元素 本地离线存储 新标签： article、footer、header、nav、section 新表单： calendar、date、time、email、url、search 模块化 可复用性、方便维护、利于协作 BEM：B -> 块（Block）、E -> 元素 （Element）、M -> 修饰符（Modifier） 最佳实践 书写规范：小写、闭合 合理使用标签：语义化、模块化 声明正确的文档类型 少使用框架 结构、表现、行为分离：不写内联样式 学习提升 多看手册（W3School） 分享文章（UED、个人博客、前端社区） 查看元素（Chrome、Firefox） 告别随意（实践出真知…） 《CSS基础》 CSS概念 CSS基本概念、引入方式、CSS规则 ...