首先

先添加一个widgets,代码如下(提示:使用时注意修改命名空间)

<?php
/**
* User: yiqing
* Date: 2014/12/15
* Time: 0:21
*/ namespace year\widgets; use yii\widgets\Block; class CssBlock extends Block
{ /**
* @var null
*/
public $key = null;
/**
* @var array $options the HTML attributes for the style tag.
*/
public $options = []; /**
* Ends recording a block.
* This method stops output buffering and saves the rendering result as a named block in the view.
*/
public function run()
{
$block = ob_get_clean();
if ($this->renderInPlace) {
throw new \Exception("not implemented yet ! ");
// echo $block;
}
// $block = trim($block) ;
$block = static::unwrapStyleTag($block); $this->view->registerCss($block, $this->options, $this->key);
} /**
* @param $cssBlock
* @return string
*/
public static function unwrapStyleTag($cssBlock)
{
$block = trim($cssBlock);
/*
$jsBlockPattern = '|^<script[^>]*>(.+?)</script>$|is';
if(preg_match($jsBlockPattern,$block)){
$block = preg_replace ( $jsBlockPattern , '${1}' , $block );
}
*/
$cssBlockPattern = '|^<style[^>]*>(?P<block_content>.+?)</style>$|is';
if (preg_match($cssBlockPattern, $block, $matches)) {
$block = $matches['block_content'];
}
return $block;
}
}

使用

示例如下:

<?php \year\widgets\CssBlock::begin() ?>
<style type="text/css">
.fr {
float: right;
}
.mt10 {
margin-top: 10px;
} .mt15 {
margin-top: 15px;
}
</style>
<?php \year\widgets\CssBlock::end()?>

总结

为什么要这么写?

这样写的好处有两个,有代码提示和有代码高亮!!

来源地址:http://www.getyii.com/topic/10

Yii2 如何更好的在页面注入CSS的更多相关文章

  1. Yii2 如何更好的在页面注入JavaScript

    先添加一个widgets <?php /** * User: yiqing * Date: 14-9-15 * Time: 下午12:09 */ namespace common\widgets ...

  2. 页面定制CSS代码初探(一):页面变宽 文本自动换行 图片按比缩放

    初识博客 初写博客,先在设置里选了个喜欢的模板 第一眼就爱上了呢!那极简的风格,我喜欢!!但是,应用后,却发现... 纳尼!模板上右侧那张漂亮的图片呢?!我的怎么什么都没有.没有图片好难看啊,瞬间无爱 ...

  3. 我的页面定制CSS代码(SimpleGamboge皮肤)

    我的页面定制CSS代码,针对博客园SimpleGamboge皮肤. 调整: 1.左上图片更换为自己的头像 2.扩大左侧栏宽度,缩小右侧主栏宽度宽度 3.扩大内容页面的评论区宽度,工具图标靠左 4.去广 ...

  4. 动态为页面添加CSS样式文件引用

    动态为页面添加CSS样式文件引用: if (document.createStyleSheet) { //IE document.createStyleSheet("./Themes/Def ...

  5. wow.js让css3动画变动更有趣(滚动页面动画模拟懒加载特效)

    CSS3的出现给网站页面增加了活力,网站增色不少,有这么小小的一款插件就能做出很多动画效果. 最重要的是它:简单易用.轻量级.无需 jQuery......他就是wow.js 地址:https://d ...

  6. EasyUI Tabs + Yii2.0实现iframe方式打开页面(解决共用静态文件引入加载的问题)

    在项目实际开发中,有将打开的各个链接页面隔离的需求(防止静态资源起冲突),这个时候常规思路就是使用iframe来实现!但遇到一个比较棘手的问题,当用easyui Tabs打开一个iframe页面时,怎 ...

  7. struts2的action的知识点和利用action向页面注入值的操作

    1.      Action的顺序,会先搜索指定名字下的包的action,如果找不到会去搜索默认路径下的包下的action. 2.      如果没有给action设置值,那么action会有一些默认 ...

  8. Stylus-NodeJS下构建更富表现力/动态/健壮的CSS

    --------------------------本文来自张鑫旭大神博客------------------------------ 一.为什么我会讲Stylus,而不是SASS和LESS? SAS ...

  9. 前端开发工程师 - 04.页面架构 - CSS Reset & 布局解决方案 & 响应式 & 页面优化 &规范与模块化

    04.页面架构 第1章--CSS Reset 第2章--布局解决方案 居中布局 课堂交流区 水平列表的底部对齐 如图所示,一个水平排列的列表,每项高度都未知,但要求底部对齐,有哪些方法可以解决呢? & ...

随机推荐

  1. javascript判断是否为数组 面试题

    1.方法 instanceof:多框架下有问题(看示例代码). Object.prototype.toString.call():兼容性很好 Array.isArray: IE9+以上 constru ...

  2. STL学习笔记(已序区间算法)

    针对已序区间执行的算法,执行前提是源区间必须在某个排序准则下已序. 搜寻元素(Searching) 1.检查某个元素是否存在 bool binary_search(ForwardIterator be ...

  3. 怎么以最新汇率牌价计算XX美元相当于多少人民币

    http://www.meiguozhuji.com/exchange-rate 美国主机都是以美元来报价的,至于XX美元相当于多少人民币,很多朋友都不太清楚.为了让大家更直接的了解购买美国主机需要花 ...

  4. Android下Fragment使用(全集)

    1 http://blog.csdn.net/niu_gao/article/details/7163263  思路清晰,讲解详细,代码偏少,推荐高手阅读 2 http://blog.csdn.net ...

  5. c#关闭excel进程失败的解决方法

    解决方法如下: 1.运行命令dcomcnfg -32,打开组件服务 2.找到execl服务,属性中设置交互式用户 2.设置用户权限 3.设置IIS权限

  6. Extjs4 Combobox 联动始终出现loading错误的解决的方法

    当反复选者combobox 联动时,下级的Combobox 会出现loading的错误表现形式,尽管Store数据已载入完也是一样. 废话少说贴代码就知道怎样处理了:(注意红色部分的关键语句) }, ...

  7. Android开发系列之系统源码目录

    相信大家对于Google给出的那副经典Android架构图非常的熟悉,从下往上依次是Linux内核层(主要是负责硬件管理调度),HAL层(主要是硬件抽象层),libs层+Runtime,Framewo ...

  8. hadoop常见算法(持续更新)

    1. 对以下数据进行排序,根据收入减去支出得到最后结余从大到小排序 账号 收入 支出 日期 zhangsan@163.com 6000 0 2014-02-20 lisi@163.com 2000 0 ...

  9. 华为nova3超级慢动作酷玩抖音,没有办法我就是这么强大!

    华为nova3超级慢动作酷玩抖音,没有办法我就是这么强大! 在华为最新发布的nova 3手机上,抖音通过华为himedia SDK集成了60fps.超级慢动作等华为媒体开放能力,在加持这些能力后,抖音 ...

  10. Servlet和JSP中的过滤器都是Java类

    JSP 过滤器 Servlet和JSP中的过滤器都是Java类,它们存在的目的如下: 在请求访问后端资源时拦截它 管理从服务器返回给客户端的响应 下面列出了多种常用的过滤器类型: 认证过滤器 数据压缩 ...