### 笔记 > class跟id不一样，class本来就是设计用来可以重复利用的，而id才是设计唯一的（如果遵循BEM，class几乎也都是唯一的了）。 这个重用分为：**当前页面多处使用**，和 **多个页面可以使用**，比如 #container 是属于后者，当然了也有两种情况都有的。 不过我们也不必要纠结这么细，不要总感觉如果写了一个样式，只能在一个地方用一次（指上面两种情况都不满足）的话，就很吃亏了，很浪费，总抱有这种想法是不对的（**玻璃心，处女座，强迫症，偏执狂，完美主义者的人真的活得好累啊**），计算机没你想的那么矫情和脆弱的，你别担心它，你还是多担心自己吧，能重用固然是很好，可总有些特殊的东西啊，真正的完美就是能够包容不完美，当你能够接纳自己的不完美的时候，很多东西就会有细微的变化，一切都会向好的方向去发展的。 [是什么阻碍了代码的重用？问题是否应该只解决一次即可？ - 知乎](https://www.zhihu.com/question/21011591) >[danger] 因为复用并非无代价，而且代价往往还很高。 * * * * * > 四、让规则越具体越好 >不要试图编写像 ol li a 这样的长选择符，最好是创建一个像.list-anchor一样的类，并把它添加到适当的元素上。 具体是语义明确，清晰，而不是照搬DOM结构才叫具体，以前犯了好多错误啊。 无论多复杂的东西，也能分门别类，如果不能，那只能说明类别太多了。（世上万物都有其位置，都有其定律） 不过我们也不要纠结于这么细，不要总感觉，如果写一个样式，只在一个地方用一次（上面两种情况都不满足）那就很吃亏了，能重用固然是很好，可总有些特殊的东西啊，真正的完美就是能够包容不完美。 * * * * * class用于标识某一个类型的对象，命名必须言简意赅。 命名分为：面向属性的命名（原子性，比如颜色），面向“语义”的命名（业务逻辑的语义） 这一切都是为了css命名语义化 * * * * * ### CSS的属性有： 位置类：定位，宽高，边框，内外边距，位置等 外观类：文字大小，颜色，背景颜色，CSS3颜色等，边框颜色、圆角等等 * * * * * ### 元素在面向业务是反而属性有： 位置类：在页面中位置，顶部，尾部，侧边，是否居中，宽高，等等 外观类：状态，选中，当前，危险，提示等等 * * * * * ### 命名是抽象的 或者说是抽象与具体结合的，但其实，具体也是抽象的，世间万物都是抽象的。 我们来看人名，比如说，马蓉这个名字： 马为姓名，表示她姓马，从而可知他爸爸姓马，可能还能知道是什么笔派的。 蓉为名，一岁一枯荣，蓉是花的意思，一般只有女孩的名字才会出现这个字。父母给她起这个是希望她健康，像花儿一样成长，成长环境，家庭的熏陶决定了孩子的性格，所以根据这个名字基本可以猜测这个女孩的性格了。 名字是抽象的，你可以说它有意义，也可以说她没意义，在于你怎么理解。 根据上下文关系，情景，我们把一些词归为，动词，名词，形容词，主谓宾，其实这些概念就是人们创造出来的，创造出来的那么它的本质就是抽象的，世间万物本是不存在的，世间万物其实都是抽象的，**为什么要抽象，因为要具体**，人们希望对事物更加了解，具体，所以才抽象出来很多东西，形成共识，这就是我们掌握知识的基础。 命名时首先列出这个事物的几个关键对象，比如侧边，关联，容器，记录，关联操作等等，先找出这些关键对象，在对它进行抽象。 * * * * * ### 掌握知识技巧 学习任何东西都是应该抱有目的性的，就像当初学html一样，学到用的时候才知道怎么学，顺其自然的就会用css了，就知道class的好处了，会用class摆脱将样式写在元素上的痛苦了，这一切就是那么自然。 当你学习后，亲身做过，在这个过程中，你自然就掌握知识了。 * * * * * ### 什么是完美？ * * * * * [内存锁与内存事务 - 刘小兵2014](https://my.oschina.net/digerl/blog/34001#tt_daymode=1) > 如果世界已经是完美的，为什么我们还需要工作呢？ * * * * * [关于纠结](https://www.kancloud.cn/xiak/product/344394) > 人生苦短，要做更有意义的事 [程序员为什么要一直改BUG，为什么不能一次性把代码写好？ · php笔记 · 看云](https://www.kancloud.cn/xiak/php-node/574447) > 比如网络通信协议，同样不完美，但我们不能等到完美那一天才上网。 * * * * * [Java 老矣，尚能饭否？](https://mp.weixin.qq.com/s/HTleF2EVow3q6BMe_Cm4YA) >[info] 1998 年 12 月，Java 第一个里程碑式的版本，即 Java 1.2 发布了。这个版本使用了 JIT（Just in time）编译器技术，**使得语言的可迁移性和执行效率达到最优的平衡**，同时 Collections 集合类设计优良，在企业应用开发中迅速得到了广泛使用。 >[danger] 没有东西是完美的，只能在某个点上达到一个平衡，趋于完美。至于平衡向那边倾斜，这取决于你的当下的具体情况，任何事物都是相对的，没有绝对的，站在这个点是最好的，站在另外一个点就是完全不同了，所以永远记住，任何事都是相对的。 * * * * * [css行高line-height的一些深入理解及应用 « 张鑫旭-鑫空间-鑫生活](https://www.zhangxinxu.com/wordpress/2009/11/css%E8%A1%8C%E9%AB%98line-height%E7%9A%84%E4%B8%80%E4%BA%9B%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E5%8F%8A%E5%BA%94%E7%94%A8/) > 文字 px 高？并不是。 [去除inline-block元素间间距的N种方法 « 张鑫旭-鑫空间-鑫生活](https://www.zhangxinxu.com/wordpress/2012/04/inline-block-space-remove-%E5%8E%BB%E9%99%A4%E9%97%B4%E8%B7%9D/) > 无法要求我们源代码中去除空格和换行，对精度细节有要求的话，只能设置font-size:0了。 [使用 box-shadow 进行画图](https://mp.weixin.qq.com/s/q_c5r-fVJ3AvpDcJCUQUxA) ***** [你所不知道的 CSS 阴影技巧与细节](https://mp.weixin.qq.com/s/6hSW1A1uMY7CwvkPgQxSEw) [Vue: scoped 样式与 CSS Module 对比](https://mp.weixin.qq.com/s/FoDei2gy0Mtqy608FOxGwQ) [你未必知道的CSS故事：揭开leading的面纱](https://mp.weixin.qq.com/s/CsETZ7Ad3vkDpIo6zDufFg) [什么是关键 CSS]([https://mp.weixin.qq.com/s?\_\_biz=MzA5NzkwNDk3MQ==&mid=2650585406&idx=1&sn=862751889d949b987bf8c238b6053a18&source=41#wechat\_redirect](https://mp.weixin.qq.com/s?__biz=MzA5NzkwNDk3MQ==&mid=2650585406&idx=1&sn=862751889d949b987bf8c238b6053a18&source=41#wechat_redirect)) [生成精灵图 工具网站推荐](https://www.toptal.com/developers/css/sprite-generator/) [精灵图自动检测工具网站推荐](http://www.spritecow.com/) [这33个超级好用的 CSS 选择器，你可能见都没见过](https://mp.weixin.qq.com/s/o1ECWAYh_Atuk8iVmCibjw) * * * * * update time：2017-8-24 01:18:14