关于CSS切片

html-css024

关于CSS切片,第1张

你好,我是网页设计师,希望我的回答能为你带来帮助!

CSS切片这个词不是这么说的:第一,CSS是新式,也就是样式结构表,用来定义网页布局,进行网页美化的样式。

第二,切片,就是用PS画的图片,只是用切片工具进行切片,也可以直接复制那个图片进行保存,切片,直接说就是一道过程,要把图片进行切割而已,为什么会用么切片就是因为PS画的效果图是分层的,有时候在层次上需要几个图层一起下来,用切片就方便一点,不过我不喜欢切片,我喜欢把图保存一张高质量的JPG后再进行复制,这只是设计师的爱好而已。

因为一个PS效果图要做成一个网页,不切片的话上传上去就是一个图片的形式了,就不会出现文字,所以要进行切片排版,这样才可以输出文字,当然这得靠我们的程序员了。

切好片之后的排版,就要用到CSS样式来进行文字,或图片的控制,这就是CSS定义样式,起到美化的作用。

CSS中的background-repeat属性,比如background:url(1.gif) repeat-x这种就是让背景图在X轴上重复出现。。。就是一长条

repeat-y就是一竖条

no-repeat就是不重复,

上面那句是合写,如果你看不懂,其实可以这样写

background:url(1.gif)

background-repeat:repeat-x

这是图片背景的原因。在设置background里,有些属性你应该好好看看。

如果你切一个小条,设置background:url(../image/...) no-repeat它就是一小条。

如果你切一个小条,设置background:url(../image/...)它就是一块由小条重担组成的。

你可以试试。还有更多的属性。、

有问题可以随时Hi我。可以共同交流学习。呵呵

PSD 就是网页设计图,而 CSS+DIV 则属于网页代码方面的,网页制作就是把平面设计图转化为网页的形式。

1. 设计图要区分好背景和文字,一般除了广告图里面的文字以外全部文字都不作为背景,背景有底面背景、模块背景、头部背景、导航栏背景、和一些按钮图标,每一处的背景都要将上层文字隐藏,然后把每一块都切片,一个图大约有几十个背景图片。

2. 切片的技巧,切片后,保存为 Web 应用格式,一般的背景图片可以用 GIF 格式存储,可调节颜色数量(只有黑白两种颜色就选择2),这样图片文件较小;而广告图就用 JPG 格式存储,品质8左右就足够了。

3. CSS+DIV :一个是用 div 布局,技巧很多,例如,一般网站都按照头部—中部—尾部三大块布局,还有“先上下后左右”的原则布局;另一个就是用CSS控制样式,元素样式完全使用样式表控制,样式表技巧更多,表分类可以分开全局样式表、首页样式表、栏目页样式表,另外有解决浏览器兼容问题的元素默认样式,还有公共类样式,例如 .w980 代表宽度为980px的网页 .hot 热门词加个深一点的颜色,等等。