0

我正在使用Joomla 2.5RESPONSIVE TEMPLATE。但是我的组件没有响应。如何使用TWITTER BOOTSTRAP更改我的组件响应?

任何人都知道请给我建议

谢谢

普拉萨纳

4

1 回答 1

1

一个有趣的挑战。正如其他人指出的那样,如果没有看到示例 URL,就无法为您提供具体建议,但这会让您入门。

  • 包括引导 css 和可选的 bootstrap.js,或者通过将它们添加到模板来在站点范围内,或者使用像JS CSS Control这样的扩展并仅在特定页面上加载它们
  • 自定义 CSS 可能需要仅针对使用扩展的页面上的元素。如果是模块添加模块类后缀(在模块管理器 > 高级设置下),或者如果它是菜单项,则链接 CSS 样式(在菜单管理器 > 链接 > 链接类型选项下)
  • 某些插件和组件将需要 Bootstrap js,因此您可能需要也可能不需要它。如果这样做,您还必须在调用 bootstrap.js 之前添加 jQuery。由于您使用的是 Joomla 2.5,因此默认情况下会加载 MooTools。这可能与 jQuery 发生冲突,因此要么使用扩展来加载 jQuery,要么您可以禁用 mootools

然后有趣的部分开始了。

  • 使用浏览器转到使用扩展的页面,检查扩展插入的元素,并查找具有硬编码尺寸的元素,并使用自定义 CSS 样式表以百分比值覆盖这些元素。

    因此,例如,如果有一个具有硬编码尺寸的图像,并且您对上面的模块类后缀使用make-responsive,则自定义 css 将类似于

    .make-responsive img {
    宽度:30%; 高度:自动;}

    在实践中,扩展可能会插入多个图像,并且您需要对它们进行不同的样式设置,因此请寻找其他属性或类,而不是您可以挂钩的其他属性或类以仅针对有问题的图像(例如.make-responsive table img {..}

  • 要进一步完善流程,您可能需要使用媒体查询来定位不同的设备宽度
  • 检查使用浏览器宽度时会发生什么。也许您需要在某些视口中为某些选择器添加浮动和清除以获得所需的排列,或者您甚至需要隐藏一些元素。

如果你幸运的话,这将是你需要做的所有事情。如果扩展严重依赖表格布局,那么这可能很难使用。

祝你好运!

于 2013-06-16T12:11:36.810 回答