CSS教程(4):通过实例学习CSS背景

网页制作Webjx文章简介:本教程介绍:1.如何仅显示一次背景图像,2.如何放置背景图像,3.如何使用%来定位背景图像。 本教程介绍:1.如何仅显示一次背景图像,2.如何放置背景图像,3.如何使用%来定位背景图像。参考网页教学

本教程介绍:1.如何仅显示一次背景图像,2.如何放置背景图像,3.如何使用%来定位背景图像。 本教程介绍:1.如何仅显示一次背景图像,2.如何放置背景图像,3.如何使用%来定位背景图像。
参考跟版网建站关于CSS背景的理论知识:CSS教程(1):学习CSS背景相关知识。 1、如何仅显示一次背景图像
本例演示如何仅显示一次背景图像。
<html>
<head>
<style type="text/css">
body
{
background-image: url('/i/eg_bg_03.gif');
background-repeat: no-repeat
}
</style>
</head>
<body>
</body>
</html> 2、如何放置背景图像
本例演示如何在页面上放置背景图像。看到本信息说明该文是通过网页教学(jb51.net)整理发布的,请不要删掉!
<html>
<head>
<style type="text/css">
body
{
background-image:url('/i/eg_bg_03.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
</style>
</head>
<body>
<body>
<p><b>注释:</b>为了在 Mozilla 中实现此效果,background-attachment 属性必须设置为 "fixed"。</p>
</body>
</body>
</html> 3、如何使用%来定位背景图像
本例演示如何使用百分比来在页面上定位背景图像。
<html>
<head>
<style type="text/css">
body
{
background-image: url('/i/eg_bg_03.gif');
background-repeat: no-repeat;
background-attachment:fixed;
background-position: 30% 20%;
}
</style>
</head>
<body>
<p><b>注释:</b>为了在 Mozilla 中实现此效果,background-attachment 属性必须设置为 "fixed"。</p>
</body>
</html>
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

CSS实现背景透明,文字不透明(各浏览器兼容)[转载]以下是示例CSS部分代码:
js中call()和apply()方法很常用,因为他们可以将函数绑定到其他对象上实行,从而实现继承, php点点通 示例如下: scriptfunction Person(name,age){this.name = name;this.age = age;this.say = function(){docu
1.length属性,它随数组的个数变化而变化,也可以手动设置 语法表达:numVar = arrayObj.length 2.concat()方法,返回一个新数组,这个新数组是由两个或更多数组组合而成的。 语法表达:arr
跟版精品模板网提供JavaScript,XMLHttpRequest,等网页设计素材资源,提供相关网页设计资源的教程和免费下载。跟版网,专业织梦网页设计模板资源站。。
跟版精品模板网提供jqgrid,学习笔记,等网页设计素材资源,提供相关网页设计资源的教程和免费下载。跟版网,专业织梦网页设计模板资源站。。
跟版精品模板网提供超链接,title,等网页设计素材资源,提供相关网页设计资源的教程和免费下载。跟版网,专业织梦网页设计模板资源站。。