阿莹yes的博客

css中的长度单位一共有8个，分别是px，em，pt，ex，pc，in，mm，cm；px,em和rem用的较多，em和rem是用来适配不同屏幕的，最终也会换算成px来进行布局因此对于精确度没有限制1）网页布局中一般都是用px。2）百分比一般宽泛的讲是相对于父元素，自适应网页布局用的多。3）viewport：可视窗口，也就是浏览器。calc()使用通用的数学运算规则，但是也提供更智能的功能：使用“+”、“-”、“” 和 “/”四则运算；可以使用百分比、px、em、rem等单位；

总结一下大概就是要安装跟node版本匹配的node-sass和，如果使用的都是最新版本，直接执行以下指令即可或这里的–save-dev和–save的区别只是下载到里的或，两者区别在于前者是在本地环境用到的依赖，后者是在开发环境需要用到的依赖，只在本地开发的话–save-dev即可。踩坑，留下足迹~原文链接：https://blog.youkuaiyun.com/August_802/article/details/124985920。

SCSS是一种CSS预处理语言定义了一种新的专门的编程语言，编译后形成正常的css文件，为css增加一些编程特性，无需考虑浏览器的兼容性（完全兼容css3），让css更加简洁、适应性更强，可读性更佳，更易于代码的维护等诸多好处。CSS预处理语言有SCSS (SASS) 和LESS、POSTCSS。

在做项目的时候用什么单位长度取决于你的需求，我一般是这样的：1、像素（px）：用于元素的边框或定位。2、em/rem：用于做响应式页面，不过我更倾向于rem，因为em不同元素的参照物不一样（都是该元素的父元素），所以在计算的时候不方便，相比之下rem就只有一个参照物（html元素），这样计算起来更清晰。1、rem和em单位是由浏览器基于你的设计中的字体大小计算得到的像素值。2、em单位基于使用他们的元素的字体大小。3、rem单位基于html元素的字体大小。4、em。

修改滚动条样式1. 滚动条属性2. 滚动条样式修改第一种方式第二种方式3. IE下面的CSS设置滚动条1. 滚动条属性主要有以下7个属性::-webkit-scrollbar 滚动条整体部分，可以设置宽度啥的::-webkit-scrollbar-button 滚动条两端的按钮::-webkit-scrollbar-track 外层轨道::-webkit-scrollbar-track-piece 内层滚动槽::-webkit-scrollbar-thumb 滚动的滑块::-webkit

文章目录BFCIFCGFCFFC最近回顾基础，发现这个还是有必要记录下来的。于是，就有了这篇文章。BFCBFC(Block Formatting Contexts)直译为"块级格式化上下文"。Block Formatting Contexts就是页面上的一个隔离的渲染区域，容器里面的子元素不会在布局上影响到外面的元素，反之也是如此。如何产生BFC？float的值不为none。overflow的值不为visible。position的值不为relative和static。

1rem等于html根元素设定的font-size的px值如果css里面没有设定html的font-size，则默认浏览器以1rem=16px来换算。假如我们在css里面设定下面的csshtml{font-size:14px}那么后面的CSS里面的rem值则是以这个14来换算。例如设定一个div宽度为3rem,高度为2.5rem.则它换算成px为width:42px.height:35px同理，假如一个设计稿为宽度42px,高度为35px则换成rem，则是42/14=3rem，35/14=2

目录语法的认识word-breakword-wrapwhite-space富文本里的 html 标签之间有空格单词超出显示省略号(单行)单词超出显示省略号(多行)说在最后语法的认识word-breaknormal｜break-all ｜ keep-allnormal：使用浏览器默认的换行规则。keep-all：允许在单词内换行。keep-all：只能在半角空格或连字符处换行word-wrapnormal | break-wordnormal：只在允许的断字点换行(浏览器保持

目录问题解决办法兼容IE10Chrome 、Safari等Firefox 4-18Firefox 19-50Internet Explorer 10–11、Internet Explorer Mobile 10-11EdgeCSS Working Draft问题遇到修改placeholder的颜色的需求解决办法改变placeholder的颜色input::placeholder { color: green;}改变input的文字的颜色input { color: red;}

目录问题自定义边框去除边框问题input聚焦时，浏览器会有一个默认的高亮边框自定义边框input{border: 1px solid green;}去除边框input{outline: none;}码字不易 留下足迹！！！