如何在 CSS 中指定固定的背景图像?
在本文中,我们将看到如何在 CSS 中指定一个固定的背景图像。为了在 CSS 中保持背景固定、滚动或局部,我们必须使用背景-附件属性。
背景-附件 : 这个属性在 CSS 中用来设置背景图像为固定或滚动。此属性的默认值是滚动。
背景附件属性的值:
- 滚动:是背景-附件属性的默认值。它用于滚动带有背景页的图像。
- 修正:背景图像不会滚动。它与页面固定在一起。
- 本地:背景图像会随着内容滚动。
要保持背景图像固定,必须使用值为“固定”的背景附件属性。
语法:
background-attachment: fixed;
示例:
超文本标记语言
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1 {
text-align: center;
}
#ex {
text-align: center;
background-image:
url("https://media.geeksforgeeks.org/wp-content/uploads/geeks-25.png");
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
</style>
</head>
<body>
<h1>Example for fixed Background Image</h1>
<div id="ex">
<p>
Paragraphs are the building blocks
of papers. Many students define
paragraphs in terms of length: a
paragraph is a group of at least
five sentences,
</p>
<br><br>
<p>
a paragraph is half a page long,
etc. In reality, though, the unity
and coherence of ideas among
sentences is what constitutes a
paragraph.
</p>
<br><br>
<p>
A paragraph is defined as “a group
of sentences or a single sentence
that forms a unit” (Lunsford and
Connors 116).
</p>
<br><br>
<p>
Length and appearance do not
determine whether a section in
a paper is a paragraph.
</p>
<br><br>
<p>
For instance, in some styles of
writing, particularly journalistic
styles, a paragraph can be just
one sentence long. Ultimately, a
paragraph is a sentence or group of
sentences that support one main idea.
</p>
<br><br>
<p>
In this handout, we will refer to this
as the “controlling idea,” because it
controls what happens in the rest
of the paragraph.
</p>
</div>
</body>
</html>
输出:
支持的浏览器:
- 谷歌 Chrome 1.0
- Internet Explorer 4.0
- Firefox 1.0
- 歌剧 3.5
- Safari 1.0
版权属于:月萌API www.moonapi.com,转载请注明出处