仅将视图的css代码直接放在视图中

Question

我正在使用CakePHP进行练习，只是想知道logical/right thing是否CSS仅将view部分专用于模板<style> .form-element-name { width:150px; /* colors and other stuff are placed in main css */ } </style> <form> <div class="form-element-name">Username</div><input name="myuser"/> <div class="form-element-name">Password</div><input name="mypass"/> <etc.../> </form> 。

我正在谈论这样的事情：

{{1}}

Answer 1

执行此操作的方法是按照以下方式调用HTML-Helper：

<?php echo $this->Html->css('forms'); ?>

该文件必须位于/app/webroot/css文件夹中才能生效。当助手自动添加时，不需要扩展名.css 不要忘记将HTML-Helper添加到控制器var $helpers = array('Html');

如果你这样做，你可以保持布局和内容在逻辑上分开，我称之为良好实践。

还可以查看CakeBook，了解有关HTML-Helper。

的更多信息

Answer 2

我会把它放在一个单独的文件中，只让这个视图暂时调用它。这样，如果您需要进行大量更改或将其用于其他内容，您可以复制/编辑该文件，或将其调用到另一个视图中。

Answer 3

您希望将所有CSS放在尽可能少的文件中。这是因为浏览器一次只下载2个文件，每个页面有许多不同的文件意味着等待下载时间。

此外，您将无法利用浏览器缓存，因为每个单独的文件将被使用一次。而不是在第一页面上下载一个大文件，然后在后续页面视图中从缓存中获取。

Tl; dr单个大文件比多个小文件快。