码迷,mamicode.com
首页 > Web开发 > 详细

css命名规范

时间:2016-02-13 11:07:42      阅读:175      评论:0      收藏:0      [点我收藏+]

标签:

1.使用小写字母加中划线来命名css类和css文件

2.组织css文件

global.css 包括一些可以重用的基础性样式

layout.css 用来布局

ControllerID.css 每个控制器都有其相应的css文件比如PostController.php css为post.css

widget-WidgetClass.css小部件对应的css样式比如 widget-lastest-comment.css

FeatureName.css 大的特性可以有其专门的样式文件,比如markdown.css

其他必须的css文件,比如css frameworks

3.css class的命名

一些通用的样式可以用g-起头,比如,g-link-button{...}, 这样的一些样式可以放在global.css当中

每一个action的view文件都要有一个根容器并且根容器的命名对应view的路径,比如,

post/index.php

<div class="post-index">...view content here...</div>

所有的view相关的css都应被放进控制器自己的css样式文件中,其中的每一个样式声明都应该加上view css class的前缀,比如,.post-index .item{...}

小部件专属的class的命名和view中class命名雷同,比如,.widget-latest-comments .comment{}

4.包含css文件

需要压缩处理一下子,这样可以让浏览器缓存,加快网页打开的速度,下面是改写一下layout.php

<head>
    ......
    <?php if(Yii::app()->params[‘css.files.compressed‘]): ?>
    <link rel="stylesheet" type="text/css" 
          href="<?php echo Yii::app()->baseUrl.‘/css/‘
              . Yii::app()->params[‘css.files.compressed‘]; ?>" />
    <?php else: ?>
    <?php foreach(Yii::app()->params[‘css.files‘] as $css): ?>
    <link rel="stylesheet" type="text/css" 
          href="<?php echo Yii::app()->baseUrl.‘/css/‘.$css); ?>" />
    <?php endforeach ?>
    <?php endif ?>
</head>

5.jquery 选择器的写法与css类命名遵循相同的规则

css命名规范

标签:

原文地址:http://www.cnblogs.com/sky-view/p/5187476.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!