是否可以将 MaterializeCss 集成到 Bootstrap
Is it possible to integrate MaterializeCss into Bootstrap
我问过自己(未测试)是否可以将两者 bootstrap and materializecss 集成到同一个项目中
由于这两个框架的目的相同,并且可能在某些 class 定义等方面重叠。是否仍然可以结合这两个框架以扩展我的样式选项?
Materialize 既不基于 Bootstrap,也不只是 "visual layer",同时使用这两个框架可能会导致很多不兼容问题,或者至少会出现很多重叠,因为它们的大部分功能是多余的(网格、菜单、图标等)。
我个人使用这个项目 Bootstrap material design,它是 Bootstrap 的主题并且效果很好。
如果你不 need/want Bootstrap 你也可以使用 Material Design Lite that has been recently released by Google. It is a light CSS framework based on Material Design guidelines. Light in comparison to Angular Material or Polymer 也可以使用 Material 设计指南但部分或需要其他 javascript 框架(即 Angular).
有可能,我已经在一个 Web 表单中测试了这两个框架,尽管控件的某些属性重叠,尤其是调用 container[=16= 的 <div>
标记] class 为标签。
对于网格,由于某种原因(我不知道),它实际上仍然遵循引导程序。因为我尝试重新排列 <script>
标签的顺序,所以 bootsrap 网格仍然是 webpage/webform.
使用的那个
我在我的 bootstrap 网站上添加了 Materialise,它运行良好,就像 JC Borlagdan 所说的,尽管有一些重叠。我只是使用网站检查器(通常右键单击 > 检查元素),然后关闭 bootstrap 或具体化 属性 以查看我更喜欢哪个并删除我不喜欢的样式像。只要确保您获得非缩小版本的物化和 bootstrap.
您需要设置CSS个文件的顺序,如
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/yourStyle.css" rel="stylesheet"/>
现在您可以覆盖 bootstrap css 类 或 id,并且可以制作您自己的 CSS 样式。
您可以从 materialize.css 中删除 GRID,然后只编译一个带有 BT GRID 且没有按钮、标签等的自定义 bootstrap 包。
不要使用任何 BT jQuery 插件,然后在您的模板中首先编译并加载 bootstrap.min.css,然后是修改后的 materialize.css 和 materilize.min.js.
您还可以只集成按钮、卡片或颜色,方法是从 materialize.css 中挑选它们并插入 template.css / style.css 进行覆盖
bootstrap 样式或向您的 GRID 添加替代 css 类。
我不确定这是否可能。 Material 设计 是 Google 的新内容,其中包括响应式,而 Bootstrap 库 来自 Twitter,似乎主要是面向响应的。
查看此对话:http://forums.oscommerce.com/topic/407994-material-design/?hl=material
我怀疑他们不会相互融合,并且会严重冲突,但也许其他人有更多信息。
我问过自己(未测试)是否可以将两者 bootstrap and materializecss 集成到同一个项目中
由于这两个框架的目的相同,并且可能在某些 class 定义等方面重叠。是否仍然可以结合这两个框架以扩展我的样式选项?
Materialize 既不基于 Bootstrap,也不只是 "visual layer",同时使用这两个框架可能会导致很多不兼容问题,或者至少会出现很多重叠,因为它们的大部分功能是多余的(网格、菜单、图标等)。
我个人使用这个项目 Bootstrap material design,它是 Bootstrap 的主题并且效果很好。 如果你不 need/want Bootstrap 你也可以使用 Material Design Lite that has been recently released by Google. It is a light CSS framework based on Material Design guidelines. Light in comparison to Angular Material or Polymer 也可以使用 Material 设计指南但部分或需要其他 javascript 框架(即 Angular).
有可能,我已经在一个 Web 表单中测试了这两个框架,尽管控件的某些属性重叠,尤其是调用 container[=16= 的 <div>
标记] class 为标签。
对于网格,由于某种原因(我不知道),它实际上仍然遵循引导程序。因为我尝试重新排列 <script>
标签的顺序,所以 bootsrap 网格仍然是 webpage/webform.
我在我的 bootstrap 网站上添加了 Materialise,它运行良好,就像 JC Borlagdan 所说的,尽管有一些重叠。我只是使用网站检查器(通常右键单击 > 检查元素),然后关闭 bootstrap 或具体化 属性 以查看我更喜欢哪个并删除我不喜欢的样式像。只要确保您获得非缩小版本的物化和 bootstrap.
您需要设置CSS个文件的顺序,如
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/yourStyle.css" rel="stylesheet"/>
现在您可以覆盖 bootstrap css 类 或 id,并且可以制作您自己的 CSS 样式。
您可以从 materialize.css 中删除 GRID,然后只编译一个带有 BT GRID 且没有按钮、标签等的自定义 bootstrap 包。
不要使用任何 BT jQuery 插件,然后在您的模板中首先编译并加载 bootstrap.min.css,然后是修改后的 materialize.css 和 materilize.min.js.
您还可以只集成按钮、卡片或颜色,方法是从 materialize.css 中挑选它们并插入 template.css / style.css 进行覆盖 bootstrap 样式或向您的 GRID 添加替代 css 类。
我不确定这是否可能。 Material 设计 是 Google 的新内容,其中包括响应式,而 Bootstrap 库 来自 Twitter,似乎主要是面向响应的。
查看此对话:http://forums.oscommerce.com/topic/407994-material-design/?hl=material
我怀疑他们不会相互融合,并且会严重冲突,但也许其他人有更多信息。