html - 向上移动图标并与我的主标题内联

Question

我正在尝试使用顶部的主图标四处移动，该图标位于导航栏中。我正在使用 Bootstrap 和一个名为“Site.css”的普通 css 文件

在我的母版页中，我通过以下方式获取文件:

<link href="Content/Site.css" rel="stylesheet" />
<link href="Content/bootstrap.css" rel="stylesheet" />

部分代码:

<div class="navbar-header">
                <a class="navbar-brand" runat="server" href="~/default.aspx">M-Hotels&nbsp;
                <div class="IconFront">
                    <asp:Image class="img1" ID="Image1" runat="server" Height="28px" ImageUrl="~/Icon.png" Width="30px" ImageAlign="Right" />
                </div>
                </a>
            </div>

好吧，现在图标与标题内嵌了。我只想将图标向上移动一点，但似乎做不到。

尝试使用 Site.css 文件中的 CSS:

IconFront {
position:absolute; 
}

img1 {
position:relative; 
top:10px; 
left:0px; 
}

但是有了这个，什么也没有发生..它只是不会移动:(

Answer 1

您正在使用错误的选择器语法访问类。向选择器添加一个点。

.IconFront {
  position:absolute; 
}

.img1 {
  position:relative; 
  top:10px; 
  left:0px; 
}