我正在 Liferay 6.2 中使用 Bootstrap 3。我在CSS和JS中插入了bootstrap.css和bootstrap.min.js。我还更改了 custom.css 中的一些样式 incompatilibilidad
你对此有更好的想法吗？
然后我附上了在 Liferay 6.2 中插入 Bootstrap 3 所遵循的步骤。上面给了我一些兼容性问题......我想听听您的意见，例如是否有更优化的代码可以与这些工具和这些版本一起使用。我需要您的帮助来改进这一点，以便每个人都可以在 Liferay 6.2 中使用 Bootstrap 3。这是我的两分钱。
STEPS:
1 - 将 Bootstrap CSS、JS 和字体放入主题内的 _diffs 目录文件夹中
2 - 我们打开或创建 main.css 文件并调用文件 Bootstrap.css
3 - 在portal_normal.vm 上添加两个对JavaScript 的调用，其名称如上述方案中所示。
4 - 我们在 custom.css 中插入与版本 2.3.2 默认的 Liferay 冲突的 CSS 类
--- 自定义.css ---
.signed-in .collapse { display:block; }
.lfr-edit-layout-panel .collapse{ display:block; }
.dockbar.navbar-static-top .collapse { display: block; }
.navbar-inner .collapse{ display:block; }
.dockbar-ready section#content { padding: 0 0 0 0; }
.dockbar.navbar-static-top {
background-color: transparent;
padding: 0px;
}
.dockbar-messages{ display:none; }
.lfr-device-preview{ z-index: 1000; }
.modal{ display:block; }
.modal-hidden{ display:none; }
你觉得这个怎么样：
”
您需要采取一些技巧才能使 bootstrap 3 的部分内容在 liferay 中工作。
我曾与一位设计师合作过，他非常希望在 Liferay 的某些部分使用 Bootstrap 3。
这是我已经完成的：在主题项目中，我将引导库复制到 css 文件中。在该文件夹上，我使用以下代码创建了一个 scss 文件：
.bootstrap-3 {
@import "bootstrap";
}
其中 bootstrap 指示根据 scss 规则要包含的文件： _bootstrap.scss 基本上是由原始 css 制成的文件。
诀窍是在需要使用库的地方使用命名空间。
当调用AJAX内容时，我们只需要添加类..有时CSS规则会因为类的数量和liferay使用的id而变得更加棘手，但按优先级付费应该可以解决..
我宁愿使用这种方法，因为它更容易控制与原始库的冲突......”
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
