Question

我几天前开始学习CakePHP，跟随他们的博客教程现在我正在为自己编写一个小项目来熟悉框架。

在研究了他们的文档后，我注意到有两种方法可以包含CSS文件一种方法是使用HtmlHelper回显链接标记：echo $this->Html->css(array('style', 'forms', 'modal'));。根据options数组，这种类型的链接被称为“内联样式”。

另一种方法是将标签添加到（我相信默认？）CSS块中，然后在<head>内打印该块：

echo $this->Html->css(array('style', 'forms', 'modal'), array('inline' => false));
echo $this->fetch('css');

使用单向另一种方式有什么好处？

Answer 1

考虑以下布局文件：

...
<head>
...
<?= $this->Html->css('main.css'); ?>
<?= $this->fetch('css'); ?>
...
</head>
...

最简单的方法

默认情况下，渲染视图将包含：

...
<head>
...
<link rel="stylesheet" type="text/css" href="/css/main.css" />
</head>

如果没有与是否应添加css文件相关的逻辑 - 只需编辑布局文件并添加css文件，忽略inline属性即可。

优势：简单，清晰，明显地发生了什么

动态方式

但是，如果存在与是否应包含特定css文件相关的逻辑 - 这就是inline属性变得有用的地方。

考虑以下视图文件：

<?php
if ($something) {
    $this->Html->css('maps.css', ['inline' => false]);
    echo $this->element('maps');
}
?>
View contents

或包含以下帮助程序的插件：

<?php
class AwesomeHelper extends AppHelper {

    public function beforeLayout() {
        $this->Html->css('awesome.css', ['inline' => false]);
        $this->Html->js('awesome.js', ['inline' => false]); // also applies to js files
    }
}

在不使用内联属性或编辑布局文件的情况下，无法将css文件添加到渲染输出的头部。但是，通过使用内联属性，可以构建最终视图所需的css文件。

优势：布局文件外的代码可以将所需的css文件添加到头部中的输出。

CakePHP：在使用HtmlHelper时，将CSS添加到CSS块而不是使用内联输出的优点是什么？

1 个答案:

最简单的方法

动态方式