1.注意对图片设置宽高和转化为块2.文字超出的设置3.空白部分用空div来设置4.做之前考虑重用,重用部分命名不要和内容相关 尽量公共(comWidth area small big img list txt box line)5.需要复写的地方再加上一个class用后面的class复盖前面的样式6.多个class的运用 fl fr clearFix7.h1-h6不会继承父级样式需要设置大小和字体family8.图片列表左浮动 margin-right时 给最外层DIV固定宽度 overflow…

先 yarn eject 释放出来配置文件具体参见我之前写过相关的文章(这里不再重复), 找到 config 文件夹下的文件如下图所示: 找到如图所示的配置: 书写 css 的文件名例如(App.module.css) 引入时候使用 import styles from './App.module.css' 使用时候 className = {styles.xxx} 即可生效. 当前 ( 2019.01.19 ) 对于 css module 方式书写 CSS 的方法 create-react-a…

原文链接:A look into writing future CSS with PostCSS and cssnext 译者:nzbin 像twitter,google,bbc使用的一样,我打算看一看使用PostCSS处理的css的世界. PostCSS是什么? PostCSS 是使用 javascript 插件转换 css 的后处理器.PostCSS 本身不会对你的 css 做任何事情,你需要安装一些 plugins 才能开始工作.这不仅使其模块化,同时功能也会更强. 它的工作原理就是解析…

我在写CSS的时候经常会碰到些麻烦事儿: 1)看上去蛮简单的排版却写了很久 2)代码写的越来越散,总是这里补一句,那里补一句,没有条理性 3)margin.padding.font-size等属性在不停的重写 效率提不上去,工期又赶,最后只能加班加点做. 后面仔细想想,其实自己可以做的更有计划性,更有条不紊的推进. 一.全局观 我们这边开发是按流程来进行的,UI设计没给出,是坚决不开工的. 在UI设计给出后,最多只是做些无伤大雅的微调,这样的话,其实在给出所有UI设计稿后,可以做个大概的评估.…

Sass团队创建了Compass大大提升CSSer的工作效率,你无需考虑各种浏览器前缀兼,只需要按官方文档的书写方式去写,会得到加上浏览器前缀的代码,如下: .row { @include display-flex; } 会得到如下代码: .row { display: -webkit-flex; display: flex; } 但是, 做为一个长期用原生CSS书写方式的CSSer,不太习惯去官方查文档,再以@include方式书写. 那么问题来了,我只能放弃高效率方式么? 其实不然, Aut…

1. 自定义样式名 实例1:<style type="text/css"> input.ng-invalid{ // .号一定要在对应的元素名后面, 没有空格 color: red; } </style> 实例2: input[type=text]:focus{ // 用type=text 指定input类型 outline: none; // 如何把蓝色去掉? border: 1px solid #58b195; // 如何改成别的颜色? } 实例3: 去掉i…

1.border-color      继承内部元素前景色(color:black.可能对元素本身没有效果) 2.border-style:none;//不仅样式没了,border-width也变为03.margin.padding百分数继承父元素width 4.背景是固定的(fixed),background-attachment:fixed,则都是从窗口左上角开始定位,而不是本身元素 5.clear原理:在块元素上方加一个清除区域,使内容区顶端正好与浮动块底端紧挨,但块元素的margin-t…

如果一个元素设置了postion:abslute;top:20;botoom:20因为设置了top又设置了botoom所以元素会有高度.…

一.css顺序 首先声明,浏览器读取css的方式是从上到下的.我们一般书写css只要元素具备这些属性就会达到我们预期的效果,但是这会给以后的维护和浏览器的渲染效率带来一定的影响,那么该怎么书写css的顺序呢?有没有一定的规范呢? 首先我们知道css的属性按特性分为几类: 1.规定元素特性,如display.position.float,这些属性会决定他的排版方式 2.规定元素的空间占据,如line-height.margin.padding.width.height等,这些属性会决定元素的大小和…

前端体系的变化可谓是日新月异,短短一年时间,从理论.框架.构建工具.甚至开发语言都发生非常大的变化. 随着新项目就即将启动,我抽时间回顾了一下以往项目的前端架构,零零散散产生了许多想法,尽量一一记录下来,为新的框架搭建做点准备. 首先来聊聊CSS的的各种规范与理论.回顾过去的代码,首先让我头痛不已的就是那些不知所谓的类名,以及数不清的难以维护的CSS/LESS代码. 我曾经对自己和前端小组的成员提出过要求,强制使用BEM方法来书写CSS,但是在使用的过程中,也出现了总总问题. 它带来的好处是显而…