一、在样式表开头添加一个注释块,用以描述这个样式表的创建日期、创建者、标记等备注信息。

/*
*Site: www.daqianduan.com
*Author: 浩子
*Updated: 2010.5.7
*Updated by: raceman
*/
二、包括公用颜色标记

/*
COLORS
Body background: #def455
Container background: #fff
Main Text: #333
Links: #00600f
Visited links: #098761
Hover links: #aaf433
H1, H2, H3: #960
H4, H5, H6: #000
*/
三、给ID和Class进行有意义的命名

不推荐的命名方式:
.green-box { … }
#big-text { … }
推 荐使用的命名方式:
.pullquote {… }
#introduction {… }

四、将关联的样式规则进行整合

#header { … }
#header h1 { … }
#header h1 img { … }
#header form { … }
#header a#skip { … }#navigation { … }
#navigation ul { … }
#navigation ul li { … }
#navigation ul li a { … }
#navigation ul li a:hover { … }
#content { … }
#content h2 { … }
#content p { … }
#content ul { … }
#content ul li { … }[/css]

/*
navigation styles
*/
#navigation { … }

五、给样式添加清晰的注释

/*
header styles
*/
#header { … }
#header h1 { … }
#header h1 img { … }
#header form { … }
在大前端后面的文章中,我们将讨论如何管理你整站的CSS文件呢。请大家关注。

PC--CSS维护的更多相关文章

  1. 代码:PC CSS(工作中用)

    常规内容区域的:标题和文字 2016-5-23 .p16{font-size:16px;color:#333;}/* 16号#333的标题 */ .p12-gray{font-size:16px;co ...

  2. 根据判断PC浏览器类型和手机屏幕像素自动调用不同CSS的代码

    1.媒体查询方法在 css 里面这样写 -------------------- @media screen and (min-width: 320px) and (max-width: 480px) ...

  3. 前端分辨pc和移动端导入不同css

    通过navigator获取浏览器,根据浏览器的不同判断出pc和移动端然后设置不同的css 分辨不同屏幕导入不同的css文件: function loadCSS() { if((navigator.us ...

  4. XHTML 基础(含部分css)

    基于http://www.ycku.com/xhtml/ 的视频教程的一些笔记 关于xhtml的解释 引用百度百科 可扩展超文本标记语言,是一种置标语言,表现方式与超文本标记语言(HTML)类似,不过 ...

  5. 翻译 | 关键CSS和Webpack: 减少阻塞渲染的CSS的自动化解决方案

    原文地址: Critical CSS and Webpack: Automatically Minimize Render-Blocking CSS 原文作者: Anthony Gore 译者: 蜗牛 ...

  6. CSS架构的优选和解决方案

    背景 上周我厂前端小伙伴们开了一个技术交流会,关于如何优选CSS架构.解决掉平时写CSS时频繁出现的各种问题,这是前端人员老生常谈的问题,但却很少搬上台面,铺开正式地开交流会.这次会议,便是围绕CSS ...

  7. JS判断PC还是移动端打开网页

    最近在做移动端网站,也需兼容PC端.还没找到更好的方法,只能用javascr判断用户是在PC端打开还是移动端打开. JS判断 var isPC = function (){    var userAg ...

  8. js手机端和pc端加载不同的样式

    function loadCSS() {     if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android| ...

  9. js css等静态文件版本控制,一处配置多处更新.net版【原创】

    日常web开发中,我们修改了js.css等静态资源文件后,如果文件名不变的话,客户端浏览并不会及时获取最新的资源文件,这就很尴尬了 怎么办呢? 1.小白:让客户清除缓存?,No ,  不靠谱 2.初级 ...

  10. 【CSS】378- [译]44个 CSS 精选知识点

    写在前面 一个周五的晚上,闲来无事整理下自己的 github(经常做收藏党),今天打算都过一遍,发现一个 star很高的项目,里面有大量的 CSS 片段,而且标题很诱人,然后又花了将近1个小时从头到尾 ...

随机推荐

  1. crtmpserver通常使用基本类演示

    以前我们做了分析过程,这一次,我们都参与了类做梳子,两个可以一起关注一下一起合并,整个方案的实施是有帮助. BaseClientApplication APP基类,一切APP都基于这个类 Stream ...

  2. Android Fragment详解(四):管理Fragment

    要管理fragment们,需使用FragmentManager,要获取它,需在activity中调用方法getFragmentManager(). 你可以用FragmentManager来做以上事情: ...

  3. 如何实现带照片缩略图的Listview

    ackage com.demo; import java.util.ArrayList; import android.app.Activity; import android.content.Con ...

  4. VCS仿真 Dump Memory

    VCS仿真 Dump Memory 两种方法 vcs联合verdi生成fsdb文件 vcs生成vpd文件 VCS联合verdi生成fsdb文件 1.testbench中加入如下语句: initial ...

  5. css布局详解(二)——标准流布局(Nomal flow)

    css标准流布局(Nomal flow) 一.正常流 这是指西方语言中文本从左向右,从上向下显示,这也是我们熟悉的传统的HTML文档中的文本布局.注意,在非西方的语言中,流方向可能不同.大多数元素都在 ...

  6. 除非另外还指定了 TOP 或 FOR XML,否则,ORDER BY 子句在视图、内联函数、派生表、子查询和公用表表达式中无效。

    在 SELECT 后加 TOP 100 PERCENT .

  7. redis批量执行

    1.首先把redis命令放在txt文件中 eg: 文件名:  test.txt 内容如下: HMSET HM_001 name zhang01 age HMSET HM_002 name zhang0 ...

  8. ORACLE函数详解【weber出品】

    一.什么是函数 一个函数: 1. 是命名的PL/SQL块,必须返回一个值 2. 可以存储到数据库中重复执行 3. 可以作为表达式的一部分或者提供一个参数值 二.创建函数的语法 必须至少有一个返回值,创 ...

  9. Emacs显示行号

    在配置.emacs文件中加上    (global-linum-mode t) 启动emacs后按     m-x  global-linum-mode 就可以显示行号,但是每次打开emacs,要重新 ...

  10. NYOJ 110 剑客决斗

    110剑客决斗 在路易十三和红衣主教黎塞留当权的时代,发生了一场决斗.n个人站成一个圈,依次抽签.抽中的人和他右边的人决斗,负者出圈.这场决斗的最终结果关键取决于决斗的顺序.现书籍任意两决斗中谁能胜出 ...