css background-repeat属性笔记

原创 PHP笔记  2017-09-24 19:12  阅读 1,083 views 次

在css中,background-repeat属性是用来设置是否重复背景图像和如何重复背景图像。在默认的情况下,背景图像在水平和垂直方向上重复。背景图像由background-image定义,并根据background-position的值放置。

background-repeat属性值

  • repeat:垂直和水平方向重复(默认);
  • repeat-x:水平位置会重复背景图像;
  • repeat-y:垂直位置会重复背景图像;
  • no-repeat :不会重复;
  • inherit:指定background-repea属性设置从父元素继承。

语法格式:

background-repeat:repeat / repeat-x / repeat-y / inherit;

实例:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css background-repeat属性笔记</title>
<style>
#br
{
width:500px;
height:300px;
border:1px solid blue;
background-image:url('https://www.ggbiji.com/wp-content/themes/Nana3.18/images/logo.png');
background-repeat:repeat-y;
}
</style>
<head/>
<body>
<div id="br">css background-repeat属性演示</div>
</body>
</html>

运行结果:

背景简写属性——>css background属性笔记

本文地址:https://www.ggbiji.com/css-background-repeat.html
版权声明:本文为 PHP笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情