个人随笔
技术改变世界

CSS 只显示一次背景图片

示例

bg-no-repeat

在设置背景图片后,默认是平铺重复图片来填满整个背景。在CSS中如果我们想只显示一次背景图片,操作是很简单的。

只需要在CSS中加入 background-repeat: no-repeat代码即可。

如果还是不太明白,请参考以下完整代码来实现本文图片中的效果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS背景图片只显示一次</title>
<style type="text/css">
body {
	background-image: url(http://www.wxzzz.com/wp-content/uploads/2014/05/css-bg.gif);
	background-repeat:no-repeat;
}
</style>
</head>

<body bgcolor="skyblue">
<span>文本内容</span>
</body>
</html>

转载请注明出处王旭博客 » CSS 只显示一次背景图片

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址