3

由于某种原因，背景没有出现。

这是CSS

div.sidebar_beige {
background: no-repeat left top;
height: 142px;
margin: 35px 0 35px 0;
position: relative;}

div.sidebar_beige h3 {
    color: #f57f20;
    font-family: 'trebuchet ms';
    font-size: 17px;
    left: 15px;
    margin: 0px;
    padding: 0px;
    position: absolute;
    top: 15px;
    width: 163px;
}
div.sidebar_beige p {
color: #454343;
font-family: 'trebuchet ms';
font-size: 12px;
left: 15px;
margin: 0px;
padding: 0px;
position: absolute;
top: 42px;
width: 165px;}

div.sidebar_fcs {
 background-image: url('../images/sidebar_backup_online.png');
}
div.sidebar_lap {
 background-image: url('../images/sidebar_backup_laptoprepara.png');
}

这是使用的html：

<div class="sidebar_lap sidebar_beige">
            <h3>
              Laptop Reparatie
            </h3>
            <p>

              U kan niet gelijk een nieuwe<br />
            laptop kopen? <br />
            We zijn de goedkoopste<br />
            van Friesland.
            </p>
          </div>
4

5 回答 5

1

如果可能，最好的方法是在正文元素上为每个页面提供一个唯一或有用的类和/或 ID。因此，仅举个例子，一页是：

<body class="bg-custom">

另一个是

<body class="bg-custom-right">

然后在你的 CSS 中你可以像这样改变它：

.bg-custom #selector { background-img: url(...);}
.bg-custom-right #selector { background-img: url(...);}

您想要在每个页面上更改的元素在哪里#selector——但不必为每个元素提供它自己的新（复制）样式规则或类名，从而使您的 CSS 和 HTML 更清晰，更易于维护。（作为奖励，如果您还需要对每页编辑使用相同的技巧，您可以这样做。）

于 2010-02-28T12:34:50.753 回答
0

您可以在此处使用覆盖顺序来发挥您的优势：

使复制的.css 只包括：

div.sidebar_beige_lap {
  background: url('../images/sidebar_backup_laptoprepara.png') no-repeat left top;
}

在您的页面中，按顺序包含它们：

<link rel="stylesheet" href="original.css" />
<link rel="stylesheet" href="copied.css" />

任何被覆盖的属性都copied.css将获胜，否则original.css将继承 from 的属性。

于 2010-02-28T12:28:24.453 回答
0

在你的 div 上使用两个类：

<div class="sidebar lap">...

将 bg 法师从侧边栏类中拉出来，以便所有 div 都可以共享它。为您需要的每个不同的 bg（lpa、fcs 等）设置一个新类，其中仅包含bg 图像。

于 2010-02-28T12:28:40.440 回答
0

使用多个 CSS 类分配：

HTML FCS：

<div class="sidebar_fcs sidebar_beige">...</div>

HTML 圈：

<div class="sidebar_lap sidebar_beige">...</div>

单个 CSS：

div.sidebar_beige {
 background: no-repeat left top;
 height: 142px;
 margin: 35px 0 35px 0;
 position: relative;
}
div.sidebar_beige h3 {
 color: #f57f20;
 font-family: 'trebuchet ms';
 font-size: 17px;
 left: 15px;
 margin: 0px;
 padding: 0px;
 position: absolute;
 top: 15px;
 width: 163px;
}
div.sidebar_beige p {
 color: #454343;
 font-family: 'trebuchet ms';
 font-size: 12px;
 left: 15px;
 margin: 0px;
 padding: 0px;
 position: absolute;
 top: 42px;
 width: 165px;
}
div.sidebar_fcs {
 background-image: url('../images/sidebar_backup_online.png');
}
div.sidebar_lap {
 background-image: url('../images/sidebar_backup_laptoprepara.png');
}
于 2010-02-28T12:34:14.760 回答
0

你的背景图片在sidebar_lap课堂上。

在您的 HTML 中，您使用sidebar_beige_lap

将您的 HTML 更改为

<div class="sidebar_lap sidebar_beige">
于 2010-02-28T13:09:53.093 回答