用Photoshop做简单的xhtml+css网页

闪烁的光芒520

闪烁的光芒520

2016-02-19 19:22

下面图老师小编要跟大家分享用Photoshop做简单的xhtml+css网页,简单的过程中其实暗藏玄机,还是要细心学习,喜欢还请记得收藏哦!

  大家可能不知道,用Photoshop也可以做出简单的xhtml+css网页,一起来试试吧!

  1、在photoshop cs2中打开设计好的网站视觉设计稿。用切片工具切好。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

  

  2、点 “文件-》存储为web所用格式”, 快捷键为ctrl+alt+shift+s ,点右上倒三角的小图片,选择Edit output settings。

  

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

  3、见图,在第二个下拉中选择 Slices,选择Generate CSS ,然后在后面的下拉中选By ID。

  

  4、点OK保存并关闭设置窗口,在Save for Web窗口中点Save按扭,在保存类型中选择Html and Images,随便输入一个文件名,点保存。

  5、完成任务。看一下代码,是不是xhtml+css的?

  

  没想到吧?这么简单就做出了个xhtml+css的页面。当然实际应用中,这种自动生成的页面还是不太规范,建议大家还是要用dreamweaver 8或者editplus调整代码。

展开更多 50%)
分享

猜你喜欢

用Photoshop做简单的xhtml+css网页

Web开发
用Photoshop做简单的xhtml+css网页

Photoshop教程:教你简单打造xhtml+css网页页面

PS PS教程
Photoshop教程:教你简单打造xhtml+css网页页面

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

xhtml+css(网页前端工作)的绩效考核

Web开发
xhtml+css(网页前端工作)的绩效考核

XHTML+CSS网页制作问题解决的方式

Web开发
XHTML+CSS网页制作问题解决的方式

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

用Photoshop两分钟做个xhtml+css的网站首页

Web开发
用Photoshop两分钟做个xhtml+css的网站首页

XHTML+CSS布局之XHTML应用小结

Html CSS布局 Div+CSS XHTML
XHTML+CSS布局之XHTML应用小结

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Win32平台下运行的Mysql的一些特点

Win32平台下运行的Mysql的一些特点

如何设置MYSQL的口令

如何设置MYSQL的口令
下拉加载更多内容 ↓