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

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

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

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

文章发布区的边线和颜色以及文章标题和段落文字都继续用CSS的样式表写好(实在不行就照抄吧,囧rz)。对于网站开发来讲,大部分用 firefox的朋友有福了,这意味着我们可以用moz-border-radius这句话来让我们的页面有一个很漂亮的圆角就跟我们当初的设计稿一样。不过对于其他浏览器来讲我们只能降级让其实现为一个直角鸟。(不过貌似我记得IE下面也可以用css写出来圆角的说,就是比较麻烦,这里给一个参考来)


  然后在浏览器里面测试下啦~如果没写错的话那么就跟设计稿上的效果是一样的~这说明CSS彪悍的将ps设计稿里面背景颜色和边框的效果给实现了。

然后继续完善html的结构,现在轮到侧边栏了。我们来看看如何在一个容器里面用两个背景图片实现滑动门效果来让侧边栏的大小随内容来控制。

继续添加更多的CSS样式来控制html里面的元素(可怜的html沦落为css的傀儡…………我翻译累了纯属发泄这个……)比如字体的大小,颜色,种类等等(其实CSS也就这么些个本事了……)

0
投稿

猜你喜欢

  • 前言:刚认识PS的时候,就看到了动作,但一直不知道是做什么用的。后来才制作,原来我们需要做重复的东西,动作就非常用的上,而且功能强大。我们还
  • 教程主要以讲解如何利用photoshop鼠绘动物猛兽老虎,如何把整个老虎的面部勾画出来和动物毛发表现,具体步聚请看下面详细的步聚讲解:最终效
  • 本教程介绍一些夸张人物表情制作方法。制作的时候需要重点突出人物的眼睛及嘴巴,当然其它部位也可以,然后把需要突出的部位复制出来进行强行放大,然
  • 网格设计呢,通常显得很整齐规范,有时看上去也比较专业。但网格设计相对来说也是比较复杂的,往往需要精准的测量和栏目划分。960 Grid Sy
  • 本教程的实物图构造比较复杂,不过基本的构成小元素都是用类似的方法做好的。只要掌握好基本的透视及高光和暗调的变现,就很容易做出来。原图1、新建
  • 本教程仅提供一种思路只为抛砖引玉大家如果有更好的方法也拿出来共享,下面先看效果 第一步:用螺旋形工具画出一个螺旋 第二步:根据情况从中心
  • 签名效果的制作需要一些高光及笔刷素材,制作的时候就是溶图的过程,由于素材较多,每一幅素材都需要调整下颜色,跟主体颜色接近。最终效果1、打开人
  • 导读:本例是以女性时装夜秀场为主题,设计的一幅特效宣传海报作品,在制作过程中主要用到填充图层、图层属性及图层蒙版等功能。先看一下最终效果:1
  • 有人也许会好奇,有的网址前面有个漂亮的小图标而且有的网站图标还会动,这是怎么做的呢?那个小图标有个名字叫favicon.ico,网站图标虽小
  • 效果图1效果图2 效果图3 教程1  教程2 教程3 
  • 本教程利用一些简单的素材制作出非常漂亮的海报效果,整个画面就一张人物素材,其他的几乎都是用画笔刷出的图形,看来在设计中笔刷的应用也不可以忽视
  • 图片数量的增长从来不像现在这么迅猛。如果你是从一位经验丰富的摄影师手中或是著名的图片公司得到图片,那么绝大多数时候都可放心使用。但是也有很多
  • 我们有创造性的拍摄,在这种情况下,就可以表现在几乎所有的东西。我们聚集了一个充满娱乐性的图像,将它在二次合成。将这些图像变得让人深刻。
  • 最终效果图:step 1首先,我们将创建一个背景。 打开文件以一个新的白色背景。 背景更改为一个图层(双击背景),然后应用一个渐变叠加。颜色
  • 先看最终效果开始制作1、新建800*600画布!白色背景。新建图层,使用渐变色填充图层!我们先用黄色到红色的渐变色,设置如下。然后将这个图层
  • Photoshop照片合成:杯子中的惊涛骇浪艺术特效。希望大家掌握教程的思路以及Photoshop工具的使用。下面我们先来看看最终效果图:效
  • 本教程简单介绍一些偏暗人物图片的美白方法。思路:先简单的给人物磨皮,然后复制图层修改图层混合模式,然后盖印图层,再适当的模糊图片并修改图层混
  • 教程主要以是3D效果机器人为主题,将平凡的美女图片打造成为末来先进科技产品的机器人,主要工具利用表面模糊、减淡工具、加深工具、笔刷等应用工具
  • 今天要翻译的这个教程效果很炫,在做的时候希望大家不要只是按照步骤一步步做,思路很重要,体会了这个思路,后面做东西就会举一反三,第二次翻译教程
  • 来坛子混的时间不短了,咱兄弟也出个教程! 别的本事没有 就会整个糖水片片.. 要是俺调的不好 别拿扔砖头啊好歹也是第一次发教程.. 废话少说
手机版 平面设计 asp之家 www.aspxhome.com