平面设计
位置:首页>> 平面设计>> Photoshop教程>> Photoshop把PSD网站模板切图为XHTML+CSS的网页(4)

Photoshop把PSD网站模板切图为XHTML+CSS的网页(4)

 来源:asp之家 发布时间:2010-04-05 21:46:00 

标签:切图,photoshop,PSD,模板,xhtml,css

另一个导出的小的可自动伸缩部分的是导航栏的背景,它可以根据菜单文字的长度来自动伸缩。这里需要使用png的文件因为可以利用其透明度来覆盖住不同颜色的背景,这样看起来会更~和谐~~~~

文章部分在概念设计稿上是跟侧边栏有一样的边线效果,但是因为他们没有覆盖在其他的图片上并且也没有复杂的透明度等问题,所以我们将会用纯粹的css代码来实现他的效果。

接下来就是使用了蓝色渐变的内容区(也就是放留言数继续阅读等的区域),这个地方也是导出一个瘦长的区域然后横向重复就能达到其效果。


  小的评论气泡,箭头,rss标志和电子邮箱图标等,都随着logo一起单独的导出即可,最好使用png格式这样适应性更强——当然如果你确定放弃给ie6的用户使用或者浏览的话。

0
投稿

猜你喜欢

  • 名片设计是Illustrator常见的实用设计之一。本例介绍Illustrator设计传统风格商务名片的过程,和大家一起练习如何定义大小、创
  • 本教程的人物美化的非常不错,用到的步骤也较少。可谓是事半功倍。大致过程如下:先给人物磨皮,这一步是最基础的。然后润色,可以根据自己的喜好选择
  • 明度锐化和亮度锐化这2种方法操作步骤简单,是很多专业摄影师喜欢和经常使用的方法;而极致边界锐化则可以对图像锐化边界获得更多的控制权,但操作步
  •  Photoshop CS5中的"色调"技法在对人物照片进行后期处理时,首先需要定位出预期制作的风格,比如怀旧
  • 光线效果现在已经非常流行,它是一种为照片或插图添加明亮绚丽细节效果有效的方法。在本教程中,你将学到用一些简单的技术来创建一个绚丽的螺旋光线条
  •  内容摘要:教程以Step By Step的方式详细的讲解了如何从无到有设计一个时尚的网站页面,设计工具使用P
  • 本教程介绍经典的深蓝色调色方法。大致过程先把原图转成淡淡的黑白效果,保留一点原图的颜色。然后再用蓝色填充并改变下图层混合模式即可。 原图
  •            本教程的图形制作方法非常简单,只需要用钢笔工具勾出图形的
  • 作者在制作的时候非常讲究细节和颜色。用到的素材也比较多,不过作者都安排的非常到位。整个效果华丽稳重,给人较强的视觉冲击力。最终效果1最终效果
  • 蒙板是将不同灰度色值转化为不同的透明度,并作用到它所在的图层,使图层不同部位透明度产生相应的变化。黑色为完全透明,白色为完全不透明。 优点:
  • 效果图: 原图: 素材: 创建通道混合器,调整层,数值如图,图层透明度20% CTRL+ALT+~载入高光选区:新建色彩平衡整层最
  • 许多Illustrator绘制的现代矢量插画中经常会用到螺旋,例如图1中线条末端的螺旋形状,给人非常优雅的感觉。本文将向大家介绍用Illus
  • 原载于:PSHERO 教程中主要讲的是调节一种特效效果的背景,并把人物主体凸显,利用混合模式调节合适的颜色,效果非常不错。教程也算是基本的调
  • 上次我介绍了 在Photoshop加强网页设计中的细节,很多朋友都觉得讲的不够多,并且一些朋友很想了解如何在Photoshop制作一些文字的
  • 本教程主色调以青黄色为主。调色方法也比较简单,稍微用曲线调出偏青的色调,然后新建图层填充橙黄色,再改变图层混合模式即可调出混合色。原图最终效
  • 本教程主要介绍人物照片的调色和背景的处理。原图素材背景部分取景相当不错,不够没有拍摄清晰。处理的时候干脆用滤镜来模糊处理,再适当调整下颜色,
  • 本例主要为大家介绍使用Photoshop的“变换选区”命令去制作一幅拼接的长腿美女图片,制作过程中还运用了描边、自由变换、混合模式等多种工具
  • photoshop中打造一个美味青苹果最终效果预览:第一步:按一下设置建立新文档第二步:建立新层命名为“苹果”,用椭圆选区工具,按如下图形拖
  • 在绘制一个CG角色之前,还是需要做一些准备工作的,首先要对所绘人物的性别、年龄、身体特征、性格特点等有一个清晰的概念,根据这些要素再去绘制角
  • 本教程调色的时候作者非常巧妙的把Lab通道的某个通道复制到RGB图层里面,适当改变图层不透明度。这样有意想不到的效果出现。原图最终效果1、打
手机版 平面设计 asp之家 www.aspxhome.com