Yii2 如何更好的在页面注入CSS
首先
先添加一个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的更多相关文章
- Yii2 如何更好的在页面注入JavaScript
先添加一个widgets <?php /** * User: yiqing * Date: 14-9-15 * Time: 下午12:09 */ namespace common\widgets ...
- 页面定制CSS代码初探(一):页面变宽 文本自动换行 图片按比缩放
初识博客 初写博客,先在设置里选了个喜欢的模板 第一眼就爱上了呢!那极简的风格,我喜欢!!但是,应用后,却发现... 纳尼!模板上右侧那张漂亮的图片呢?!我的怎么什么都没有.没有图片好难看啊,瞬间无爱 ...
- 我的页面定制CSS代码(SimpleGamboge皮肤)
我的页面定制CSS代码,针对博客园SimpleGamboge皮肤. 调整: 1.左上图片更换为自己的头像 2.扩大左侧栏宽度,缩小右侧主栏宽度宽度 3.扩大内容页面的评论区宽度,工具图标靠左 4.去广 ...
- 动态为页面添加CSS样式文件引用
动态为页面添加CSS样式文件引用: if (document.createStyleSheet) { //IE document.createStyleSheet("./Themes/Def ...
- wow.js让css3动画变动更有趣(滚动页面动画模拟懒加载特效)
CSS3的出现给网站页面增加了活力,网站增色不少,有这么小小的一款插件就能做出很多动画效果. 最重要的是它:简单易用.轻量级.无需 jQuery......他就是wow.js 地址:https://d ...
- EasyUI Tabs + Yii2.0实现iframe方式打开页面(解决共用静态文件引入加载的问题)
在项目实际开发中,有将打开的各个链接页面隔离的需求(防止静态资源起冲突),这个时候常规思路就是使用iframe来实现!但遇到一个比较棘手的问题,当用easyui Tabs打开一个iframe页面时,怎 ...
- struts2的action的知识点和利用action向页面注入值的操作
1. Action的顺序,会先搜索指定名字下的包的action,如果找不到会去搜索默认路径下的包下的action. 2. 如果没有给action设置值,那么action会有一些默认 ...
- Stylus-NodeJS下构建更富表现力/动态/健壮的CSS
--------------------------本文来自张鑫旭大神博客------------------------------ 一.为什么我会讲Stylus,而不是SASS和LESS? SAS ...
- 前端开发工程师 - 04.页面架构 - CSS Reset & 布局解决方案 & 响应式 & 页面优化 &规范与模块化
04.页面架构 第1章--CSS Reset 第2章--布局解决方案 居中布局 课堂交流区 水平列表的底部对齐 如图所示,一个水平排列的列表,每项高度都未知,但要求底部对齐,有哪些方法可以解决呢? & ...
随机推荐
- 【转】GitHub入门详细讲解
第一:请登录https://windows.github.com/ 下载您需要的安装软件,进行安装.安装后桌面有:GitHub 和 Git Shell 第二: 申请一个帐号https://github ...
- mysql中去重复记录
Distinct 这个只能放在查询语句的最前面 参考 : https://www.cnblogs.com/lushilin/p/6187743.html
- CentOs上搭建nginx
目录 CentOs上搭建nginx 1. 在root环境下安装nginx 1.1 常用工具安装 1.2 关闭iptables规则 1.3 关闭SELinux 1.4 安装C/C++环境和PCRE库 1 ...
- Android开发和Android Studio使用教程
Android studio安装和简单介绍http://www.jianshu.com/p/36cfa1614d23 是时候把Android 项目切换到Android Studio http://ww ...
- 《Python基础教程》第20章学习笔记
python实现:https://github.com/captainwong/instant_markup c++实现:https://github.com/captainwong/instant_ ...
- jsonp 小结
JSONP是JSON with Padding的略称. 它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实 ...
- Linux高并发应用类型对系统内核的优化
Linux操作系统内核参数优化 net.ipv4.tcp_max_tw_buckets = net.ipv4.ip_local_port_range = net.ipv4.tcp_tw_recycle ...
- HDOJ 4923 Room and Moor
用一个栈维护b的值,每次把一个数放到栈顶. 看栈首的值是不是大于这个数,假设大于的话将栈顶2个元素合并.b的值就是这两个栈顶元素的平均值. .. Room and Moor Time Limit: 1 ...
- DLX精确覆盖与重复覆盖模板题
hihoCoder #1317 : 搜索四·跳舞链 原题地址:http://hihocoder.com/problemset/problem/1317 时间限制:10000ms 单点时限:1000ms ...
- ios json结构
NSString *itemJson = [NSString stringWithFormat:@"{\"Id\":\"%@\",\"Cha ...