这两者的关系是密不可分的，并不是表面上的联系。首先用ps等工具进行设计的过程中，就需要顾及到编码，最基本的就是背景的处理，例如渐变色如何设计，分离，用于网页等等。所以对两者都需要有较深的认识。
其实平面设计的层，和css
盒模型可以当作是一个概念，空间上来讲都是分层。理解了这个，也就理解了编码过程中的内容和修饰图的分离。
看到这不知道你理解的程度如何
切图，在fireworks,
photoshop等都可以，过程就是拖拽标尺线，对所需位置的图片进行导出，可以理解为批量截取。所以就像上面提到的，你得知道哪部分是需要的。
至于dw从0一句一句怎么写这个问题涉及的就太多了，给你个轮廓，你有张设计图，想做成网页，第一步就是划分整体布局，是上中下三栏，还是左中右等等典型布局，拿现在你看到的这个页面来说，就是上中下，其中中间分为两栏的典型布局。这个过程就是用div布局，整体轮廓有了，开始细化每个板块区域的内容，期间按照所需取设计图中的例如
按钮，导航的背景等等等，说的这个过程就是0到1编写的过程，另外因为跨浏览器兼容问题，需要打开很多浏览器不断的调试测试最终发布
擦，一说说了这么多，你自己动手做个页面就会理论实践相结合了
好运
一般css两种写法.class{样式1:样式1样式2:样式2样式3:样式3样式4:样式4}
.class{样式1:样式1样式2:样式2样式3:样式3样式4:样式4}
另一种是
.class{样式1:样式1
样式2:样式2
样式3:样式3
样式4:样式4}
border、margin、padding这些可以缩写的标签尽量缩写。
第一种样式写出来样式表会比较小，基本没有多余代码，但是对于修改会比较麻烦一点，第二种方式有比较多的代码(回车和空格会影响文件大小，但是影响不大)，但是修改起来比较方便，然而这样竖着写有时样式太多还是容易混乱。现在还没个标准，怎么写顺手就怎么写，简洁主要在布局和使用的样式减少，而不在写法，可以多定义些共用的样式，class="样式1 样式2"可以同时使用多个样式，这样可以节省css代码，而且更清晰
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：td {padding: 20px}。
3、浏览器运行index.html页面，此时表格中的文字被设置为都距离上下左右20px大小。
