css3计算宽度calc()响应式布局

有时候写css需要让元素自适应布局，css3新增了一个元素宽度属性calc，可以通过计算得到宽度，示例代码如下：

1.html

<header class="header_bg">
    <div class="back"> < </div>
	<div class="title">我是一个标题</div>
</header>

2.css

.header_bg {
	background-color: #4DC786;
	display: flex;
	align-items: center;
	width: 100%;
}
.header_bg .back{
    color: #ffff;
    width:44px;
    height:44px;
	display: flex;
	align-items: center;
}
.header_bg .title{
	width: calc(100% - 88px);
	font-size: 16px;
    font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #ffff;
	text-align: center;
}

总结：calc里面的加减符号之间必须要加空格，不然效果实现不了