将文本定位在下方和位置:固定图像

时间:2014-08-26 21:54:08

标签: html css twitter-bootstrap

我有一个Boostrap网站,顶部有一个导航栏,连续两列div。第一列包含图像,应始终保持固定。第二列包含(可能)一两页文本,应该独立滚动。

我已使用position:fixed将图片保持在适当的位置,但我的问题是我想在其下添加一个链接到该页面的条款和条件的链接。

image

BootPly

这可能吗?

非常感谢。

2 个答案:

答案 0 :(得分:0)

有几种方法可以做到这一点。因为你没有任何工作可以解决问题所以我不会进入代码,所以我希望你能理解我的解释。

  1. 您也可以尝试简单地添加链接position: fixed,并设置链接元素的top属性,使其位于图片下方(您可以玩转用这个)。

  2. 使用设置为div的{​​{1}},其中包含图片和链接。然后你可以简单地将图像放在div中而不进行任何定位,并且链接应该在图像下方没有任何定位。

  3. 您可以将右侧的文本设置为position: fixed,并在div中设置右侧文本的宽度/高度,以便它可以滚动。这基本上会使文档保持不变,但允许用户在右侧div中向上和向下滚动文本内容。

  4. 1号是最快的解决方案,2号IMO是最好的解决方案。如果您需要有关代码的帮助,请发布Fiddle,以便我们了解您正在使用的内容。

答案 1 :(得分:0)

试试这个:

DEMO

 <div style="position:fixed">
     <img src="http://placehold.it/100x300" class="img-responsive">
     <a href="#">Terms and Conditions</a> - <a href="#">Privacy Policy</a>
 </div>