笔记 - Front End - 新知识点归纳

Posted 2020-10-08 南阳诸葛庐

一、页面制作：

　　1、图像处理部分：

　　　　● 可以用“魔棒工具”判断背景是否为线性渐变。

　　　　● 需要切出的图片分为两类：

　　　　　　1.修饰性图片（一般用在background属性）：图标、Logo；有特殊效果的按钮、文字等；非纯色的背景等。

　　　　　　2.内容性图片（一般用在img标签）：Banner、广告图片；文章中的配图等。

　　　　● 从服务器拉取数据的图片，需要先使用img标签占位。

　　　　● 修饰性图片一般存为PNG格式，内容性图片一般保存为JPG格式；其中PNG一般使用PNG8和PNG24两种，PNG24支持半透明，但在IE6中不支持。

　　　　● 带背景切不规则小图标可以使用魔棒工具和选区工具结合来操作。

　　　　● 图片保存类型：

　　　　　　1.当图片色彩丰富且无透明要求时，建议保存为JPG格式并选择合适的品质。

　　　　　　2.当图片色彩不太丰富时无论有没有透明要求，建议保存为PNG8格式（RGB颜色，无仿色，无杂边）。

　　　　　　3.当图片有半透明要求时，建议保存为PNG24格式。

　　　　　　4.为了保证图片质量的情况，要保留一份PSD源文件以便修改。

　　　　● 添加图标但需要改变画布大小时，以左上角为中心点扩展后，不会影响已使用图标在页面中的位置。

　　　　● 合并图片分类：

　　　　　　1.同属于一个模块的图片，或同一个页面用到的图片合并。

　　　　　　2.大小相近的图片合并。

　　　　　　3.色彩相近合并。

　　　　　　4.有状态的图标合并。

　　　　　　5.综合以上，视情况优化。

　　2、开发、调试工具部分：

　　　　● 常用的Sublime Text插件有：Package Control（插件管理）、Emmet（快速编写）、DocBlockr（函数注释）、SideBarEnhancements（右键增强）、Terminal（快捷终端）等等。