将 PSD 转换为 HTML 和 CSS答案

【问题标题】：Converting a PSD to HTML and CSS将 PSD 转换为 HTML 和 CSS
【发布时间】：2016-09-02 09:16:45
【问题描述】：

最近我在考虑用Photoshop制作网站模板，然后将它们转换成HTML和CSS。

我的问题是，在使用要转换的 PSD 时，最佳的操作方案是什么？

我应该先制作主体结构，然后进行微调，还是从顶部开始，大力向下？

【问题讨论】：

标签： html css photoshop psd

【解决方案1】：

使用dreamweaver软件，而不是在一个文件夹中制作带有css样式的html网页，而不是开始到顶部标题部分比左侧部分中间部分比右侧部分最后使用css创建页脚并在查看离线输出时使用html页面附加

【讨论】：

【解决方案2】：

这取决于对您来说方便的东西。对我来说：首先，如果我有一个仪表板，其中包含网站的所有颜色和按钮、容器等（组件），那么我为它们制作 css 类。我最好的朋友是 Bootstrap ，所以我不必担心响应性。之后我查了一下，网站设计的主要结构。从最大到最小。有时我会把它们画在纸上，然后画一些草图。因此，当我要编写代码时，我会确切地知道我必须做什么。这是我的工作流程，但你想做什么以及如何做，取决于你。

【讨论】：

【解决方案3】：

https://www.youtube.com/watch?v=qMQ_OPk-eWI 使用此视频作为将 PSD 转换为 HTML 的参考。我希望这会对你有所帮助。

【讨论】：

【解决方案4】：

没有最好的方法。

我通常为页面上的所有元素在CSS file 中创建所有类，如PSD template 所示。

然后在 HTML 中使用该文件，可以使用更多 CSS、JS 进行微调

【讨论】：