Question

我已经在很多地方寻找答案，比如这里的一些论坛，daniweb，以及我在google，bing和yahoo上发现的其他类似网站，但我还是找不到一个答案。这是我的问题所在：

我正在尝试将图像编码到屏幕顶部（如果您想知道使用Chrome），我希望它显示为我的横幅的左侧。

以下是代码：

LeftBanner {
    width: 20px;
    height: 40px;
    background-color: #b0c4de;
    position: fixed;
    top: 5px;
    background:url('/Graphics/LeftBanner.png');
    background-attachment: fixed;
}

你觉得我怎么让它出现？如果在Inspect Element中，我删除了图像的复选标记，则会出现一个包含这些尺寸的框，所以我不在等式中。我尝试了很多东西，这是最后的结果。任何建议或答案都非常感激。

Answer 1

您忘记了.（类）或#（id）选择器。

Answer 2

试试这个

  .LeftBanner {
        width: 20px;
        height: 40px;
        background-color: #b0c4de;
        position: fixed;
        top: 5px;
        background-image:url('/Graphics/LeftBanner.png');
        background-attachment: fixed;
    }

http://www.w3schools.com/cssref/pr_background-image.asp

Answer 3

使用此语法，您应该删除第一个slach。

如果LeftBanner是一个类。

.LeftBanner {
    width: 20px;
    height: 40px;
    background-color: #b0c4de;
    position: fixed;
    top: 5px;
    background-image:url('Graphics/LeftBanner.png');
    background-attachment: fixed;
}

或

如果LeftBanner是id。

#LeftBanner {
    width: 20px;
    height: 40px;
    background-color: #b0c4de;
    position: fixed;
    top: 5px;
    background-image:url('Graphics/LeftBanner.png');
    background-attachment: fixed;
}

Answer 4

您不能仅在您知道的CSS中放置图像。您必须开始在HTML代码中识别它，为它创建一个ID（仅当您有多张图片时），然后如果您真的想使用CSS absolute positioning。例如，我将样式放在我的图像标记内，但这就是我所做的：

 <img src="http://www.hrtlc.org/images/amput-2.jpg"  alt="Chest X-Ray" style="position: absolute; right: 200px; top: 100px; height: 200px; width: 300px; ">

CSS图像没有出现

4 个答案: