[分享]css加背景图填充方式

CSS加背景图填充方式是一种常用的网页美化方式，可以使网页更加丰富多彩。本文将介绍3种常用的CSS加背景图填充方式。1. backgroundimage属性backgroundimage:url(图片...

CSS加背景图填充方式是一种常用的网页美化方式，可以使网页更加丰富多彩。本文将介绍3种常用的CSS加背景图填充方式。

1. background-image属性

background-image:url('图片路径'); 

这种方式是最常用的CSS加背景图填充方式，可以通过background-image属性实现。在属性值中，使用URL()函数来指定图片路径。

例如：

body{
background-image:url('bg.jpg');
} 

这段代码将背景图片设为了bg.jpg。

2. background-repeat属性

background-repeat:repeat; 

使用background-repeat属性可以控制背景图片的重复方式。可选的值有：repeat、repeat-x、repeat-y和no-repeat。其中repeat表示默认的背景平铺方式，即横向和纵向都平铺；repeat-x表示只在横向上平铺；repeat-y表示只在纵向上平铺；no-repeat表示不平铺。

例如：

body{
background-image:url('bg.jpg');
background-repeat:no-repeat;
} 

这段代码将背景图片设为了bg.jpg，并将其设置为不平铺的方式。

3. background-position属性

background-position:right bottom; 

使用background-position属性可以控制背景图片的位置。常用的值有left、center和right，以及top、center和bottom。可以通过组合这些值来控制背景图片的位置，例如：

body{
background-image:url('bg.jpg');
background-position:right bottom;
} 

这段代码将背景图片设为了bg.jpg，并将其位置设置为右下角。

总结：CSS加背景图填充方式可以通过background-image、background-repeat和background-position等属性来控制。掌握这些属性的使用方法，能够让网页更加美观。