Question

我有以下代码。

<html>
  <head>
    <style>
        .fb{
            position: relative;
            right:-1000px;
         }
         .info{
        position:relative;
         }
    </style>
  </head>
  <body>
    <div id="info"> 
    <a href="../jsp/aboutus.jsp" class="anatips" title="About Us">About Us</a> |    
    <a href="../jsp/privacy.jsp" class="anatips" title="Privacy Policy">Privacy Policy</a> 

    <a id = "fb" href="https://www.facebook.com/xyz" target="https://www.facebook.com/xyz"> <img  src="../images/facebook.png" height = 16, width = 16 /> </a>

   </div>
 </body>
</html>

我想将fb链接移动到右上角。我想我的造型不起作用。或者我在某个地方出错了？

Answer 1

您已在样式表中定义了一个类

.fb{
    position: relative;
    right:-1000px;
}
.info{
    position:relative;
}

所以在使用它时你应该做

<div class="info">
    ...
</div>
<div class="fb">
    ...
</div>

如果你想使用id，那么

#fb{
    position: relative;
    right:-1000px;
}
#info{
    position:relative;
}


<div id="info">
    ...
</div>
<div id="fb">
    ...
</div>

Answer 2

使用此#fb{ float:right; }

Answer 3

首先不要在attr =“smth”中使用空格。你也使用id而不是类，所以css选择器应该是#fb，而不是.fb

Answer 4

您在css中使用类（.class）选择器而不是id（#id）选择器

Answer 5

<div id="info"> 
<a href="../jsp/aboutus.jsp" class="anatips" title="About Us">About Us</a> |    
<a href="../jsp/privacy.jsp" class="anatips" title="Privacy Policy">Privacy Policy</a> 
<a id ="fb" href="https://www.facebook.com/xyz" target="https://www.facebook.com/xyz">     
<img  src="../images/facebook.png" height = 16, width = 16 alt="FB"/> </a>
</div>

<强> CSS

#fb
{
    float:right;
}
.info
{
     position:relative;
}

没有名为fb的班级。的 DEMO

Answer 6

由于您使用的是.而非#，因此未反映样式。在处理类时使用.，用于id #。

试试这个：

#fb{
  position: fixed;
  right:10px;
         }
 #info{
   position:relative;
}

Jsfiddle

样式不起作用

6 个答案: