Question

我正在使用设计师开发一个网站，他已经用HTML / CSS编写了整个静态网页。

我们需要一个管理后端和一个Auth组件，所以我认为一个简单的CakePHP应用程序可以很好地工作，而不是将自定义的PHP / MySQL解决方案混合在一起。我将所有静态页面转换为CakePHP语法，使用PagesController创建简单视图。我使用Bootstrap 3.0为管理员后端创建了一个完全独立的布局。

在一些前端页面上，比如我们的“注册”和“登录页面”，我想利用Bootstrap 3.0的漂亮的CSS和Javascript组件（特别是它干净的表单样式）。

但是，当我在布局的<head>中包含Bootstrap时，它与设计器创建的CSS类冲突，完全弄乱了页面的布局。

我基本上想知道是否有一种方法可以将CSS样式表 ONLY 应用于视图的内容（即signup.ctp），而不是它的布局（default.ctp）？这将为我节省大量时间和麻烦。

Answer 1

在您的视图文件中，signup.ctp只需使用Html帮助程序包含css，就像这样

echo $this->Html->css('your_css_file', null, array(
    'inline' => false
));

并确保您的布局文件中有$this->fetch('css')行。因此，它会在您定义$this->fetch('css')的部分中包含上述css。

例如：

<head>
    <?php $this->fetch('css') ?>
</head>

将在head部分中包含您已在视图中定义的css

Answer 2

您可以做的是将您的内容包含在具有特定ID（例如<div id="bootstrap"></div>）的div中，然后使用#bootstrap将所有css选择器添加到引导程序中。

Answer 3

仅使用HTML帮助程序在所需的视图文件中包含Bootstrap 3 css：

<强> $这 - ＆GT; HTML-＆GT; CSS（）;

文档页面：http://book.cakephp.org/2.0/en/core-libraries/helpers/html.html#HtmlHelper::css

CakePHP：仅将bootstrap.css应用于某些视图的内容，而不是布局

3 个答案: