一、网址:http://www.csszengarden.com/?cssfile=213/213.css

二、效果

三、CSS

body
{
background-color:#F0ECD6;
background-image:Url(Images/water.png);
background-position:top;
background-repeat:repeat-x;
}

四、说明

网页背景色与大海融为一体,这个是非常唯美的艺术效果。而更大的亮点则是,背景图片的左右两边各有一条没有特别虚化的亮线,这个背景图片如果只是随便地设为背景,那,背景会有两条比较明显线痕,这会是很重的一个败笔。但,样式表中,设置了background-position:top;背景图片在水平居中,垂直靠上的位置开始水平平辅,这两条线痕,则成了内容的左右边框,浑然天成,让人不得不感叹作者的匠心独运。

HTML+CSS实例——漂亮的背景(一)的更多相关文章

  1. HTML+CSS实例——漂亮的查询部件(一)

    一.参考网址:www.kuhnsjewelers.com 二.效果: 三.HTML <div id="search-box"> <asp:TextBox ID=& ...

  2. ASP.NET实例——漂亮的自适应宽度的导航条(仿Discuz!)

    PHP比较成熟的开放的源代码比较多,比方说PrestaShop,比方说Discuz!...... 虽然语言不同,但基本原理是一样的,有时间的话读一读,对学习ASP.NET应该是非常有好处的(唉,什么时 ...

  3. CSS实例

    CSS 实例 CSS背景 设置页面的背景颜色 设置不同元素的背景颜色 设置一个图像作为页面的背景 错误的的背景图片 如何在水平方向重复背景图像 如何定位背景图像 一个固定的背景图片(这个图片不会随页面 ...

  4. CSS:CSS 实例

    ylbtech-CSS:CSS 实例 1.返回顶部 1. CSS 实例 CSS背景 设置页面的背景颜色 设置不同元素的背景颜色 设置一个图像作为页面的背景 错误的背景图片 如何在水平方向重复背景图像 ...

  5. css制作漂亮彩带导航条菜单

    点击这里查看效果:http://keleyi.com/keleyi/phtml/divcss/17.htm 效果图: 以下是源代码: <!DOCTYPE html PUBLIC "-/ ...

  6. CSS之全屏背景图

    吐槽啦:Yeah  明天就是国庆了o(* ̄▽ ̄*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言 ...

  7. LESS CSS 实例

    值得参考的 10 个 LESS CSS 实例   2 收藏(185) LESS, Sass 和其他 CSS 预处理器是一种超棒的方法用来扩展 CSS 功能,使之更适合程序员.你可以使用变量.函数.混合 ...

  8. css网页中设置背景图片的方法详解

    在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等   用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...

  9. .NET生成漂亮桌面背景

    .NET生成漂亮桌面背景 一天,我朋友指着某某付费软件对我说,这个东西不错,每天生成一张桌面背景,还能学英语(放置名人名言和翻译)!我说,这东西搞不好我也能做,然后朋友说,"如果你搞出来了, ...

随机推荐

  1. Windows Server 2003下ASP.NET无法识别IE11的解决方法【转】

    http://www.iefans.net/windows-server-2003-asp-net-ie11-shibie/ 由于IE11对User-Agent字符串进行了比较大的改动,所以导致很多通 ...

  2. Subversion 1.8.1编译安装(self)

    Subversion 1.8中http客户端基于neon已经被移除,改用self.如果要支持http方式需要在安装svn前安装serf,安装serf推荐用serf-1.2.1,安装是./configu ...

  3. 纯CSS基于窗口垂直居中

    都是IE8+的 <!DOCTYPE html> <html> <head> <title>基于窗口垂直居中 by 司徒正美</title> ...

  4. chrome 在home下生成 libpeerconnection.log

    chrome 在home下生成 libpeerconnection.log,比较烦恼. google了下,可以有方法绕过去,如下. /opt/google/chrome/google-chrome 找 ...

  5. 【转】并发编程之Operation Queue

    http://blog.xcodev.com/blog/2013/10/28/operation-queue-intro/ 随着移动设备的更新换代,移动设备的性能也不断提高,现在流行的CPU已经进入双 ...

  6. DB2 VALUES用法详解

    都知道Oracle有一个虚表(dual),我们可以用select sysdate from dual获取寄存器中的值.在DB2中,可以通过SYSIBM.SYSDUMMY1.SYSIBM.DUAL获取寄 ...

  7. [iOS基础控件 - 6.9] 聊天界面Demo

    A.需求 做出一个类似于QQ.微信的聊天界面 1.每个cell包含发送时间.发送人(头像).发送信息 2.使用对方头像放在左边,我方头像在右边 3.对方信息使用白色背景对话框,我方信息使用蓝色背景对话 ...

  8. windbg命令分类与概述

    WinDBG的大多数功能是以命令方式工作的, 本系列将介绍WinDBG的三类命令, 标准命令, 元命令和扩展命令. =============== 标准命令 =============== 标准命令用 ...

  9. CSS基础(03)

    1.简单了解浏览器是如何渲染页面和加载页面            浏览器就是通过HTTP 协议与服务器进行通信,取到数据之后进行渲染的过程,如图:    这图是园友的看着挺符合我思路就直接拿来用了,从 ...

  10. RSA前台js加密,后台C#解密

    一.需求: 为了安全,项目中前台登陆用的密码需要加密传到后台,后台c#解密登陆密码. 二.解决方案 采用非对称加密算法RSA来达到目的,前台登陆页面一加载便发送一次ajax请求获取后台产生的公钥,用于 ...