1、拿到设计稿后不要直接切割，然后到DW里直接敲代码，首先要认真研究，把握大致的框架图，做到心里有一个整体的构思，其中还可以揣摩一些设计的风格，有兴趣的朋友完全可以让自己走上设计的道路。
2、使用ps切片，切好了保持为 WEB存储格式 弹出的窗口可以设置保持的类型的，可以设置成div加css的 如下图：切好片以后，文件保存为Web存储文件，就会弹出下面的图片。点击红框的箭头。点击输出设置。
3、新建一个HTML文件，命名为test.html，用于讲解div+css布局的基本流程。在test.html文件内，对body进行样式初始化，设置外边距margin为0，内边距padding为0，同时使用text-align设置文字居中。在test.html文件内，为了讲解方便，设置所有的div高度为200px，内容的颜色为红色。
1、在Photoshop中完成网页设计，确保所有元素和布局都已确定。使用Photoshop的切片工具将设计图切割成多个部分，特别是需要单独处理或交互的部分。虽然你提到只有一个切片，但为了生成更灵活的HTML和CSS，建议根据网页结构进行更细致的切片。导出切片：选择“文件”“存储为Web和设备所用格式”。
2、在“保存类型”处有个下拉列框可以选择，因为我们要存储为网页的格式，所以选择“HTML和图象（* html）”，再选择“保存”就可以输出一个网页格式的HTML文件与一个包含图象的名为“images”的文件夹。
3、选择“文件”菜单，然后点击“存储为Web和设备所用格式”或“导出为”。在弹出的对话框中，选择适当的格式，并调整图像质量和大小以满足你的需求。点击“存储”按钮，选择保存位置，并确保选中“生成HTML文件”或类似选项，这样Photoshop会同时生成一个包含HTML代码的文件夹和一个HTML文件。
4、打开你的Photoshop（PS）图片作品。在菜单栏中选择“文件” “存储为Web和设备所用格式”（快捷键通常为Alt + Shift + Ctrl + S）。在弹出的对话框中，选择合适的图像格式（如JPEG、PNG等），并调整图像质量和大小以满足网页加载需求。
5、打开Photoshop并创建或打开文件：首先，确保你已经安装并打开了Photoshop软件。新建一个画布或者打开你需要储存为Web网页格式的文件。根据你的需求输入文本内容或添加图片。选择“储存为Web所用格式”：在Photoshop的菜单栏中，点击“文件”选项。
1、方法一：新建一个记事本文档，修改后缀名为css。方法二：在DW中选择菜单，文件-新建-选择CSS-创建。dw中怎么定义新css？在DreamWeavercc中可以直接创建css文件，或在内面内手写输入css代码定义规则等等。
2、dwcs6怎么新建css样式？首先先打开我们的DW软件。进去之后点新建创建一个HTML的文档。在桌面先创建一个文件夹，方便放文档之类的。进去之后鼠标右键点右上角的Untitled- ，再点另存为找到你之前创的那个文件夹，点进去，然后把他存放在这个文件夹中。
3、首先启动DW软件，创建一个新文档，然后选择[；HTML]-[XHTML0]，然后点击[创建]。单击Create后，DW将为它创建一个HTML文件。我们将在body标签中添加一个div标签组。然后，在div标记中输入下图中的代码。style是指CSS样式直接添加到这个div中，所以是成功的。样式要用英文引号，不然不行。
4、新建一个HTML文件。在CSS设计器的源窗口中，点击“+”号，选择创建CSS的方式：新建CSS：创建一个全新的CSS文件。附加已有的CSS：将已有的CSS文件附加到当前项目中。在页面内创建CSS样式：直接在HTML文件的标签内编写CSS样式。编辑CSS样式：点击“选择器”窗口的“+”号，选择你想要应用样式的元素，如body。
5、在DW软件中添加CSS样式，首先需要启动DW软件并新建一个文档，文档类型选择为“HTML”-“XHTML0”，点击“创建”后，DW将自动创建一个HTML文件。接下来，我们可以在body标签内插入一个div标签组，这是进行CSS样式添加的基础。在div标签内部，可以输入如下代码片段：。
6、外联样式表创建CSS文件：在dreamweaver CS6中，选择“文件”“新建”。在弹出的对话框中，选择“CSS”作为文档类型，然后点击“创建”。在新建的CSS文件中编写你的样式规则。在HTML文件中链接CSS文件：打开你的HTML文件。在标签内添加标签来链接CSS文件。
