Question

我想将图像放在一个非常特定的地方（NAV栏的右上角），我已经使用postition：relative; （也试过绝对）并相应地移动它。

当我裁剪浏览器时，它将保留在div包装器外面的空白区域。

所以基本上我的图像没有使用div包装器进行缩放。

任何人都可以提供一些提示吗？对不起这个菜鸟问题。

这是一些代码。

<div id ="Wrapper">
<div id='cssmenu'>
<ul>
   <li><a href='#'><span>Home</span></a></li>
   <li class='active has-sub'><a href='#'><span>Products</span></a>
  <ul>
     <li class='has-sub'><a href='#'><span>Product 1</span></a>  </li>
     <li class='has-sub'><a href='#'><span>Product 2</span></a>  </li>
  </ul>
  </li>
  <li><a href='#'><span>About</span></a></li>
  <li class='last'><a href='#'><span>Contact</span></a></li>
 </ul>
<img src="images/register.jpg" width="50px" height="45px"  id="register"/>
</div><!-- end of css -->

包装div位于底部。＆＃34;注册＆＃34;的CSS id只是定位坐标

导航栏是我下载的模板。

Answer 1

根据您在评论中提供的CSS，它之所以这样做是因为您使用像素来设置宽度。如果使用百分比，图像将切换到屏幕大小。因此，如果您希望它位于容器的最右侧，请尝试：left: 99%;或更改百分比值以将其放置在您需要的位置。

Answer 2

好的，简单试试吧。

＆＃13;

<html>
  <head>
    <style>
h3 { 
    word-spacing: 100px;
}
</style>
    </head>
  
 <body>
   <!-- make sure you put it in the heading tag of nav bar right allign-->
<hr>
   <h3>
     <a href="">Example</a>
     <a href="">Example</a>
     <a href="">Example</a>
     <a href="">Example</a>
     <!--Put Image below here-->
     <img src="IMAGE.jpg">
   </h3>  
<hr>

＆＃13;

CSS html图片放置

2 个答案: