页面设计页面制作 这种背景的页面怎么切图的啊。。。主要是背景怎么整的。。。

发布网友 发布时间：2022-04-24 16:46

我来回答

共3个回答

热心网友 时间：2023-10-23 13:56

目前我无法判断你那些图片带链接，所以只能大概的给你讲一下（目前文字部分我先不管），具体我拿第三张来讲给你吧。

首先，把所有要做链接的图层都隐藏掉，剩下的层，就可以用来切图，整体背景是蓝色，所以css搞定就行。

其次，背景有一张整体的背景图，这个需要全部单独切下来，图片上面不要带任何其他元素，就只是这张单独的图片就好，布局的时候引用为背景！

然后，剩下的就是主体部分，上面的播放视频和文字我就不讲了，简单，底部的汽车促销图片也切一张大图就好，也简单。

最后，就剩下最难搞的中间部分，大概想了一下，2种方法实现，如下：
1、切成整张大图，需要做链接的地方，画上不规则热区就好了！这种比较简单些。
2、图片什么样，就切成什么样，每张小图都单独切出来（注意：要做成png格式保存，背景设置为透明），然后写html的时候，用css画出等大的不规则图形，吧图片当做背景加进去，然后用css绝对定位一下，如有链接加链接，完美实现！

备注：css画不规则图形，网上可以搜到教程，看一看就差不多，不难！

至于其他几张图，比较简单，简单说一下第二张，第二张的其实如果想简单实现，那就除文字和纯背景色外，整张切，然后有链接的地方加热点就好，想做复杂一点，就可以用到我所说的css画不规则图形，纯色的三个纵横条，不用切，css画出来，添加背景色，然后绝对定位就好，其他的该切多大就切多大，然后用css绝对定位，设置好z-index的关系，就ok了！

之前做过很多这样的网站，这都是经验之谈，完全能实现，要有问题再问我！完全纯手打啊~~

热心网友 时间：2023-10-23 13:56

你可以把背景图独立出来作为body的背景图（比如：background:url(images/******.png) no-repeat）啊，然后将其上面的小元素（比如那个“go”的图片）都单独切出来。至于其他的按钮什么的。完全可以都用css实现啊，不需要图片。因为你上面的按钮，文本框都是纯色块，即使是最上面的渐变按钮，也是可以用css实现的。这样的优点就是网页加载会快很多。你想想要是访问量多的话，可以节省多少时间。追问

我发的都是缩小了看的网页图。放大了看，是怎么衔接的那么好的啊。。。

还有背景图是大块的图，切图保存下来真的文件很大啊。。。我把背景图割成好几个图都嫌文件大。。。

追答

一些细节都在截图里面了，如果还有问题可以 382510118  你懂得，关于你的完美衔接，可以用定位来实现（position）

热心网友 时间：2023-10-23 13:57

你不会的话完全可以换一个思路，就弄好了在放上去不也是一样的效果么

他这个可能是DIV标签吧