一个平平无奇的技术宅

CSS3新增了一个很有意思的属性，其中mix和blend的中文意译均为混合，那么这个属性的作用直译过来就是混合模式。当然，我们我们通常称之为混合模式。混合模式最常见于photoshop中，是PS中十分强大的功能之一。当然，瞎用乱用混合模式谁都会，利用混合模式将多个图层混合得到一个新的效果，只是要用到恰到好处，或者说在 CSS 中利用混合模式制作出一些效果则需要对混合模式很深的理解及不断的尝试。 接下来，就让小温给小伙伴们将近几个合理的使用方案吧！

随着技术的迭代，前端需求也在越来越复杂和 “花哨”。为了适应复杂的需求，CSS（层叠样式表）也在不断的迭代更新， 越来越多的 CSS 属性不断加入提案。本文列举 6 个不常用但很有用且你见过也可能没见过的 CSS 属性，带大家领略 CSS 之美。

在前端开发中，所有页面都是以渲染的方式，通过HTML + CSS渲染出来的。本质来说，就是一些可以根据逻辑互动的图形元素组成，而在有些时候，我们往往需要拿我们对图片的理解去实现一些样式。为此，CSS中存在filter滤镜这个属性，去实现一些比较特殊的图形渲染方式。

时隔两个星期，小温终于是忙的差不多了。从今天开始恢复更新，今天打算和大家聊聊CSS样式的一些书写规范 以及 一些日常使用频率较高的技巧。卷王们，继续冲冲冲！

在前端开发中，偶尔后端返回的数据在前端展示时，预留的空间不怎么充足。但是我们又没有做适当的处理。就会出现，文本超出换行的情况，而且有些适配的布局，用百分比设置宽度的时候，当可视窗口发生变化，内容也会变形，导致`无法观看`。这时，就需要对文本做出超出限制了。

在CSS中，经常会使用到各种计量单位来设定各种模块的长宽、大小比例 、边距大小 及 定位等。 常用的计量单位有：`px、%、em` 这几个，它们已经适用于大部分项目情景的开发中，且拥有比较好的兼容性。 但是从 `CSS3` 开始，浏览器对计量单位的支持又提升到了另外一个境界，新增了`rem、vh、vw、vm（vmin、vmax）`等一些新的计量单位。利用这些新的计量单位能更好的开发出比较良好的响应式页面，适应多种不同分辨率的终端，包括移动设备等。 接下来，小温将给大伙简单阐述下常用的计量单位及用法！

W3C 推荐使用 Flex布局， 此文章讲解了一些，Flex布局实际案例。

文章目录前言一、Flex 弹性布局的定义Flex布局 组成部分关系-可视化二、使用语法2.1 flex容器的语法2.1.1 flex-direction2.2.2 flex-wrap属性2.2.3 flex-flow属性2.2.4 justify-content属性（常用）1.引入库2.读入数据总结 前言 在前端开发中，往往需要使用到各种CSS布局来搭建页面视图的结构框架。使得根据需求，将对应的内容在对应的位置。常见的CSS布局有： 简单的使用CSS 中 浮动属性 ( Float ) 来对布局进行控制；

在前端开发中，我们时常需要用到CSS样式来对页面进行装饰，但是往往在开发一个页面的时候，很多属性值常量是重复使用的，特别是当需要实现换肤功能时，往往需要定义很多属性值，如： 颜色、背景、字体大小、字体样式、图片地址、宽高等等。 那么我们是否有能够减少这种累赘庸余的现象发生呢？答案是有的，除了我们平时Vue开发中，用到的Less、scss、Sass等预编译，它们都带有可以自定义变量属性值的功能，这些功能的使用说明都能在其各自的官网中查阅到，就不做过多阐述。但是我们能否不依赖于预编译，实现CSS变量的定义呢？