如何关闭 Joomla span 类

Question

您好，我想知道如何更改我的某些模块在移动设备上的显示方式。

目前我的 index.php 文件中有以下内容：

<div id="leftcol" class="span8"><jdoc:include type="modules" name="welcome" style="xhtml" /></div>
<div id="rightcol" class="span4"><jdoc:include type="modules" name="laptop" style="xhtml" /></div>

这两个并排显示，但我想要的是在移动屏幕上查看时将它们放在彼此之上，即：

<div id="leftcol" class="span12"><jdoc:include type="modules" name="welcome" style="xhtml" /></div>
<div id="rightcol" class="span12"><jdoc:include type="modules" name="laptop" style="xhtml" /></div>

但我不确定如何实施它。非常感谢您的建议。

Answer 1

最好的方法可能是 add some custom CSS 使用像这样或类似的媒体查询：

@media only screen and (max-width: 767px) {
  #leftcol.span8 {float: none; width: 100%;}
  #rightcol.span4 {float: none; width: 100%;}
}

自定义 CSS 文件优于编辑 HTML 或 PHP 代码，因为您的更改不太可能被未来的更新覆盖。

如何关闭 Joomla span 类

How to switch off Joomla span classes

css

php

joomla

media-queries