HTML + CSS使用2张图片作为背景

Question

我有一个宽度为30px的标题图片。我有1个左边，1个右边。使用1张图片很简单：

background: #191919 url(clubzz/balk.png) right no-repeat;

background-color为#191919，图片为url()，向右移动，不重复图片，这很容易。但是现在左和右，这可能吗？

Answer 1

您可以使用背景css3来完成此任务。

.yourclass {
   background: url("yourpic.jpg") , url("otherpic.jpg");
   background-color: #191919;
   background-position: 25% 25% , 25% 25%;
 }

Answer 2

您应该使用background-repeat属性并相应地使用background-position的值。

试试这个：

.header{
height:400px; 
background: url(https://www.google.com/images/srpr/logo11w.png), url(http://upload.wikimedia.org/wikipedia/commons/2/24/Yahoo!_logo.svg);
background-color: #191919;
background-position: 10% 25% , 90% 25%; 
background-repeat:no-repeat; 
background-size:40%"

}