利用psd文件写出html css结构的流程

1、拿到psd文件后先大概定义页面的div结构,然后一行一行的写,

       ctrl + r 显示隐藏标尺 右击 标尺 --- 把里面的单位一律改为像素,

       alt + -可以放大缩小psd文件,

      space+鼠标左键可以拉动psd文件

      ctrl+d可以取消选区

1>删除默认的内外边距。

 先写顶部的HTML结构

后写顶部的CSS样式。注意版心居中,利用margin:0 auto实现盒子的居中显示,注意文本只能用text-align:center来实现。

再布局头部的内部div,一个左浮动,一个右浮动。

 

学会Photoshop切片工具的使用,将切片保存下来方便使用。导出切片: 文件-- 存储为web设备所用格式

 

 

切片删除,利用切片选择工具+delete键,或者利用视图--->清除切片就可以删除所有切片。

 

 切图时不想把不需要的元素切进去,可以利用自动选择功能把不需要的元素隐藏

选中某个图层,然后对该图层进行切片的方法。

 

转载于:https://www.cnblogs.com/jinlonghu/p/9155028.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值