为什么要重新学css，理由有很多，css这个小婊砸，接触至今已有三年，但真的说熟练恐怕不见得。特此，为了我的目标，开始重新整理css的知识，我希望，每一篇笔记都能有个例子，从而来巩固我的知识。

在学习之初，额，先介绍咱刚刚会玩的Less，对于像我这种记忆力超级差的人，有一份好一点的css文档简直是做梦啊，最近的项目要做一个主页，七个子页，最关键的是子页的细节还不大相同，不是结构，而是字体啦，间距啦，颜色啦，设计给的原型说是要色彩鲜明一点，准确的说，和以前不一样呗，无语勒，特此学习Less，网上生成http://www.lesscss.net/#online-less-compilers，当然，我用sublime 有插件直接生成哦

变量

（1）

@link-success:#00CC33#a:link{
   @link-success};——less#a:link{
   #00CC33};——css

由于变量只能定义一次，其本质就是“常量”。对于我而言，如果一个color定义三次以上，但分别是不同的层次，是可以用{class class}

但是看的蛋疼，想想要是要改其中一个，我要么重写个class来覆盖，要么修改原来的？（我彪哦，webapp font一天改好多次，要死）对于我而言，使用Less定义一下新的变量了，再在Less里放进去，关键层级清楚；

（2）

@nav: nav; .@{
   nav}{
        font-weight: bold; line-height: 40px; margin: 0 auto;    }——less

注意写法，那我现在新增个bottom nav，就so easy了

bottom.@{
   nav}    {
    font-weight: bold; line-height: 40px; margin: 0 auto;    }——less

 

（3）@var: @a;@a: 100%;

.lazy-eval-scope { width: @var; @a: 9%;}——less

重复引用了呗，但这个不一定有直接写的快，得想好层级关系，对于一般的页面，我倒是觉得上述俩基本够用，特别是跨浏览器的webkit，moz，写死人，我从来都不勤快，但爱折腾，用less省去大部分ctrl+c的工作，更关键，不是模块化么，听上去就不low。

混合

（1）将其他class,id直接塞进去

.border-small{
   border:1px solid #00CC33}.topnav{
   width:80%,.border-small};——less.topnav{
   width:80%,border:1px solid #00CC33};——css

我倒是很喜欢混合，但最好将其与调用层分割，另外，加个注释呗，老忘。

（2）使用css的选择器写法

#outer > .inner;#outer > .inner();#outer.inner; #outer.inner();其实一个意思，对于#outer {
     .inner {    color: red;  }}.c {
     #outer > .inner;}而言，但如果是这样#outer {
     .inner() {    color: red;  }}.c {
     #outer > .inner;}就会发现只生成了.c {
     color: red; }

so，如果想隐藏，如果不想要其class出现，但还有用，在class名后加（）。混合里还有important需要注意，可以通过直接赋值来完成操作

.foo (@bg: #f5f5f5, @color: #900) {
    background: @bg; color: @color; } .unimportant {
    .foo(1); } .important {
    .foo(2) !important; }

嵌套

#header {
    color: black; .navigation { font-size: 12px; } .logo {
    width: 300px; } }#header {
     color: black;}#header .navigation {
     font-size: 12px;}#header .logo {
     width: 300px;}

 

import

这个对于我来说就很好用了，我可以把一些常用的常量都封装在一个Less文件里，用的时候只需在新的Less文件里引入就好。

当然，这只是我对于css文档的一种管理方式，用来治我的间歇失忆症，最近也在重读css，也有不少收获，我想的是，通过重新学习，来开始制作我自己工作的组件。fighting！