php - 使转换后的 joomla 模板在主要内容中显示 2 列

Question

我已经按照以下步骤将 html/css 模板转换为 joomla 模板:http://www.tobacamp.com/tutorial/5-easy-steps-converting-html-template-to-joomla-template/ .

但是它没有说明如何使主要内容显示两列或三列而不是一列(如报纸等)。

我希望我的 Joomla 主页的主要内容在 2 或 3 列中显示文章。仅在主要内容中。

我什么都试过了，还是不行。

我必须输入什么 php 或 css 代码才能让我的文章显示在主要内容的 2-3 列中，而不是一个在另一个下面

Answer 1

虽然并非所有浏览器都支持，但您可以(应该)使用CSS Multi Columns为了这个目的。它适用于 IE10+、Opera 11.1+(标准语法)和 Firefox 2+、Chrome 4+、Safari 3.1+(供应商前缀)。对于其他浏览器，您可以使用 JS library .

示例用法

HTML (index.php)

...
<jdoc:include type="message" />
<div id="content">
    <jdoc:include type="component" />        
</div>
...

CSS

#content {
    -webkit-column-count: 3;
    -webkit-column-width: 75px;
    -webkit-column-gap: 20px;
    -webkit-column-rule: 1px solid #fff;
    -moz-column-count: 3;
    -moz-column-width: 75px;
    -moz-column-gap: 20px;
    -moz-column-rule: 1px solid #fff;
    -o-column-count: 3;
    -o-column-width: 75px;
    -o-column-gap: 20px;
    -o-column-rule: 1px solid #fff;
    column-count: 3;
    column-width: 75px;
    column-gap: 20px;
    column-rule: 1px solid #fff;
}