浮动CSS徽章彼此相邻,我想我想浮动

时间:2013-08-20 00:34:07

标签: html css css-float footer

我想知道如何在页脚菜单中将所有徽章浮动在一起。到目前为止我有四个徽章,但可能最多六个。徽章是我的SSL,AVG,BBB等等...我对这个网站建设的东西非常新。我使用Joomla 3.1并使用付费最新模板。我可以看到所有代码并添加徽章,但它们总是相互叠加。我有一个人帮助我,但是他们在桌子上做了它并告诉我它会起作用,但这不是正确的方法。请记住在帮助我的时候,我是一个孩子,第一次学习颜色这个问题:)感谢任何我能给予的任何帮助。

如果您查看此页面的底部(http://www.jcluforever.com/J-ADORE-GOD-CHRISTIAN-T-SHIRT-p/ts-jdrgod-prp.htm),那么他们有付款,SSl和预付款的徽章;这就是我希望我排队的方式,只有我想在我的页脚中,我喜欢5,我会添加 我想知道的是什么     https://www.paypal.com/webapps/mpp/paypal-popup','WIPaypal','toolbar=no,position = no,directories = no,status = no,menubar = no,scrollbars = yes,resizable =是的,宽度= 1060,高度= 700'); return false;“>

下一个

<div id="avgthreatlabs_safetybadge_small"><noscript><a href="http://www.avgthreatlabs.com?utm_source=H&utm_medium=NA&utm_campaign=SSBW" target="_blank">AVG Threatlabs</a></noscript></div><script language="javascript" src="https://api.avgthreatlabs.com/static/js/security_s.js"></script>

接下来将是

<!--- DO NOT EDIT - GlobalSign SSL Site Seal Code - DO NOT EDIT ---><table width=130 border=0 cellspacing=0 cellpadding=0 title="CLICK TO VERIFY: This site uses a GlobalSign SSL Certificate to secure your personal information." ><tr><td><span id="ss_img_wrapper_110-55_flash_en"><a href="http://www.globalsign.com/" target=_blank title="SSL"><img alt="SSL" border=0 id="ss_img" src="//seal.globalsign.com/SiteSeal/images/gs_noscript_110-55_en.gif"></a></span><script type="text/javascript" src="//seal.globalsign.com/SiteSeal/gs_flash_110-55_en.js" ></script><br /><a href="http://www.globalsign.com/" target=_blank  style="color:#000000; text-decoration:none; font:bold 8px arial; margin:0px; padding:0px;">GlobalSign SSL Certificates</a></td></tr></table><!--- DO NOT EDIT - GlobalSign SSL Site Seal Code - DO NOT EDIT --->

依此类推,直到我放置了我想要或可能或需要的所有徽章。我不确定你需要它的模板的哪一部分都是简短的或什么叫做LESS我被告知

2 个答案:

答案 0 :(得分:0)

最佳做法是将这些徽章嵌套在无序列表中。每个徽章都在列表项内。对于这个例子,假设每个徽章只是一个图像。试试这个:

<ul class="my-list">
<li><img src="1.jpg"></li>
<li><img src="2.jpg"></li>
<li><img src="3.jpg"></li>
<li><img src="4.jpg"></li>
</ul>

然后,在样式表中写下:

.mylist {
   list-style:none;
} 

.mylist li {
    float:left;
}

这会将您的所有项目浮动到页面左侧,并将列表项“堆叠”在彼此旁边,而不是彼此叠加。

答案 1 :(得分:0)

学习网页设计是一个需要患者,奉献精神以及比你想象的更多试验和错误的过程。它与学习一门新口语并不完全不同,除了学习一门口语,你学习了几门,然后学习如何让它们共同创造你想要的东西。如果您不感兴趣,并且您只想运营您的网站或在线业务,那么我会考虑聘请网页设计师或公司来维护为您的业务提供支持的代码;但是,如果学习真的是你想要做的,那么请阅读!

HTML

HTML或超文本标记语言是您为将数据传递到浏览器而编写的代码。获得对HTML如何工作的基本理解并不是非常复杂。我不打算在这里解释整个事情,但是here is a great beginner tutorial

CSS

CSS或层叠样式表是您使用的另一种语言,用于告诉浏览器您的数据应该如何显示。它重量很轻,而且只是简单的英语。 Here is an easy to follow guide to CSS

如果您仔细阅读这两个指南,并自己做一些实验,我相信您将能够自己解决问题。一旦掌握了HTML和CSS的基础知识,仍然需要学习,但是一旦掌握了基础知识,你就可以更好地学习更多知识。

快乐的编码,玩得开心!