html - CSS `background-repeat` 属性

标签 html css background-image

我正在阅读 Jon Duckett 的 HTML 和 CSS,并且正在学习 CSS background-repeat 属性。

enter image description here

现在,我从下面的代码片段中的 background-repeat 生成了代码。

body {
  background-image: url("https://image.ibb.co/gE9g95/header.gif");
  background-repeat: repeat-x;
  color: #665544;
  padding: 20px;
}

h1 {
  color: white;
}
<!DOCTYPE html>
<html>

<head>
  <title>Background Image (Body)</title>
</head>

<body>
  <h1>Planting Guide</h1>
  <h2>Magnolia</h2>
  <p><b><i>Magnolia grandiflora</i></b>, commonly known as the <b>Southern magnolia</b> or <b>bull bay</b>, is a tree of the family Magnoliaceae native to the southeastern United States, from coastal Virginia south to central Florida, and west to eastern
    Texas and Oklahoma. Reaching 27.5 m (90 ft) in height, it is a large striking evergreen tree with large dark green leaves and large white fragrant flowers. Widely cultivated around the world, over a hundred cultivars have been bred and marketed commercially.
    The timber is hard and heavy, and has been used commercially to make furniture, pallets, and veneer.</p>
  <h2>Ranunculus</h2>
  <p><b><i>Ranunculus asiaticus (Persian Buttercup)</i></b> is a species of buttercup (Ranunculus) native to the eastern Mediterranean region in southwestern Asia, southeastern Europe (Crete, Karpathos and Rhodes), and northeastern Africa. It is a herbaceous
    perennial plant growing to 45 cm tall, with simple or branched stems. The basal leaves are three-lobed, with leaves higher on the stems more deeply divided; like the stems, they are downy or hairy. The flowers are 3-5 cm diameter, variably red to
    pink, yellow, or white, with one to several flowers on each stem.</p>
  <h2>Tulip</h2>
  <p><b><i>Tulipa gesneriana L. or "Didier's tulip"</i></b> is a plant belonging to the family of Liliaceae. This species has uncertain origins, possibly from Asia, and has become naturalised in south-west Europe. Most of the cultivated species, subspecies
    and cultivars of tulip are derived from Tulipa gesneriana. The flower and bulb can cause dermatitis through the allergen, tuliposide A, even though the bulbs may be consumed with little ill-effect. The sweet-scented bisexual flowers appear during
    April and May. Bulbs are extremely resistant to frost, and can tolerate temperatures well below freezing - a period of low temperature is necessary to induce proper growth and flowering, triggered by an increase in sensitivity to the phytohormone
    auxin. The bulbs may be dried and pulverised and added to cereals or flour.</p>
</body>

</html>

现在,我的问题是 - 默认情况下,background-image 属性是否沿元素(在本例中为 body 元素)顶部重复(或“镶嵌”)图像?

最佳答案

背景图像根据background-position属性放置。 如果未指定背景位置,则图像始终放置在元素的左上角

默认情况下,背景图像在垂直和水平方向上重复。

https://www.w3schools.com/cssref/pr_background-repeat.asp

关于html - CSS `background-repeat` 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45909108/

相关文章:

javascript - 结合请求全屏和 F11

c# - 将包含 HTML 标记的字符串移动到资源文件

css - 悬停时更改子跨度的颜色

.body 背景图片之上的 CSS Sprites

html - 在html网页中保存R timevis时间轴

java - 在Java中将html5客户端与服务器一起使用

html - Bootstrap 图标已停止出现在我的应用程序中

ASP.NET MVC 2 验证 : Easy way to add CSS class to element on error?

css - 使用媒体查询隐藏背景图像

html - 响应式背景图片(并保持文本居中)