欢迎来到万动力,请登录 | 注册
当前位置:首页 > 新闻资讯 > 网页基础 > 网页背景图片设置的点滴积累
最新动态
公司新闻
行业资讯
万动力成长手册
使用帮助
基础知识
购买网站
后台管理
域名解析
网站异常
网页基础
付费购买
充值
网站推广
搜索引擎
付费推广
企业网站SEO

网页背景图片设置的点滴积累

更新时间:2014/06/05 11:06:58 来源:www.wandongli.com 作者 :admin 浏览量:1168

做网站前端这么多年了,不管是divcss技术,还是ps网页设计都积累了不少东西,很多时候都感觉网站前端真是个技术与艺术结合的产物,不管是技术还是艺术,都得懂,而且是很懂。
今天一个客户问起网页背景图片怎么样设置才能够是网页看起来漂亮,让用户感觉起来舒服,提高粘剔性,又不会影响到网页的加载速度。
    那我就顺便总结了一下,其实网页背景设置无外乎几个方面,关于图片和颜色:
        第一:图片要尽量的小,充分利用页面平铺技术,进行平铺,网页背景图片基本都是可以平铺的。
        第二:图片尽量做到不那么耀眼,因为网页背景毕竟只是个装饰作用的,不能够喧宾夺主,掩盖了网页主题内容。
    那么具体怎么样把图片放在网页上呢?这里就需要用到css技术了,有些人看到css看到代码就蒙了,其实很简单的,给大家做个示范吧:
先看下没有添加网页背景的网页代码:
<!DOCTYPE html>
<html>
<head>
<title>测试网页</title>
</head>
<body>
这个是我们的测试网页
</body>
</html>
    然后我们添加一个网页背景颜色:
<!DOCTYPE html>
<html>
<head>
<title>测试网页</title>
<style>
body{ background:#333333;}
</style>
</head>
<body>
这个是我们的测试网页
</body>
</html>

在浏览器打开修改后的网页是不是有一个灰色的背景了。
现在我们在这个基础上添加一个背景图片:
<!DOCTYPE html>
<html>
<head>
<title>测试网页</title>
<style>
body{ background:#333333 url(http://background.wandongli.com/upload/pic/1399113292.png);}
</style>
</head>
<body>
这个是我们的测试网页
</body>
</html>

    在浏览器打开我们修改后的网页是不是有一个特别好看的网页了。
其实网页背景设置的关键是找到一个好看的背景图片,这个向大家推荐一个专门做网页背景的网站 网页背景(http://background.wandongli.com),里边还有很多精美的网页背景,大家可以去试试,我感觉还不错哦。


【下一篇】: 在HTML中常见标签的认知

【上一篇】: 已是第一篇