将PSD转换为HTML和CSS

Question

最近我考虑使用Photoshop创建网站模板，然后将它们转换为HTML和CSS。

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

我应该首先制作主要结构，然后进行微调或从顶部开始并大力前往底部？

Answer 1

使用Dreamweaver软件比在一个文件夹中使用css样式制作html网页而不是从顶部标题部分开始比左侧部分中间部分比右部分最后使用css创建页脚并使用html页面附加ona查看脱机输出

Answer 2

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

Answer 3

没有最佳方法。

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

然后在HTML中使用该文件，可以使用更多JS，(positive if 1th bit = 1)

进行微调

Answer 4

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