用Photoshop做简单的xhtml+css网页

2016-02-19 19:22 8 1 收藏

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

【 tulaoshi.com - Web开发 】

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

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

  

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

(本文来源于图老师网站,更多请访问http://www.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调整代码。

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

来源:http://www.tulaoshi.com/n/20160219/1620848.html

延伸阅读
标签: Web开发
WEB标准 是一系列标准的集合,并不是仅DIV+CSS布局就可以实现。以CSS网页布局只是标准的基础之一。DIV+CSS布局只是一种通俗的称呼罢了。而我们学习的目标在于以XHTML建立良好的语义化的结构,结合CSS最大程度使表现与内容相分离。 一位网友对W3C标准、重构与CSS布局的理解: 不知道从什么时候开始,在网络上到处可以看到div+...
标签: Web开发
这是一篇很久以前的文章了,现在看来,其中的思想很值得大家学习,在webjx.com学习案例的同时,不仿学习一些理论的知识,对您知识的突破会很有帮助。大家加油! 自从看了Zeldman先生的力作Designing with Web Standards中文版为《网站重构》(第2版)一书,感受颇深,坚定了我用web标准的思想,去开发实践我们的项目...
标签: Web开发
xHTML+CSS与SEO的内容,后面章节会详细给大家介绍,这里就先说一些,让大家对xHTML+CSS与SEO有一定的认识,为后面制作页面打基础,毕竟我们做出来的页面还是要给搜索引擎看的,所以不能不提提xHTML+CSS与SEO的关系。 1)将页面中最重要的内容用h1标签括起来,h1的内容就和页面title很自然的包含了站点或者页面的核心关键词,搜索引擎很重视h1...
标签: Web开发
随着XHTML的逐渐推广流行,HTML 在许多场合已经显得过时。World Wide Web Consortium (W3C) 于 2000 年 6 月 26 日发布了 XHTML 的第一个版本作为推荐标准。XHTML 标准的目标是取代 html。按照 W3C 的说法,XHTML 是 html 的继承...
标签: Web开发
不知道从什么时候开始,在网络上到处可以看到div+css,到底什么是div+css呢?难道就是传说中的标准重构吗?标准从最简单的根源来说不是合理使用xhtml的标签吗?可为什么还是有这么多div+css呢?既然可以div+css,那为什么不可以叫span+css ul+css li+css等等呢? 疑问,满脑子的疑问!为了这个疑问,我把自己脑子里的东西从最底层翻了一遍。...

经验教程

753

收藏

95
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部