css百分⽐减去像素1)第⼀种实现⽅式
@body_center_width:  ~`$(document).width()-400+'px'`;
#helloworld {
width: @body_center_width;
height: 200px;
margin属性值可以为百分比background: #000;
}
@height: ~`document.body.clientWidth-400+'px'`;
#box { height:200px; width:@height; background:#080; opacity:@height; }
2)第⼆种实现⽅式
/** 1)收缩CSS代码 **/
.
box{
border:1px solid #ddd;
width:calc(100%-2px)
}
/** 2）宽度，10em加20px。 **/
－收缩CSS代码
.box{
width:calc(10em+20px)
}
/** 3）3栏等宽布局。 **/
－收缩CSS代码
.
box{
margin-left:20px;
width:calc(100%/3-20px);
}
.box:nth-child(3n){
margin-left:0;
}
⾼级运算式
－收缩CSS代码
width:calc(100%/3 - 2*1em - 2*1px);
这样写也是可以的：
－收缩CSS代码
width:calc(100% / 3 - 2 * 1em - 2 * 1px);
但是这样写就是错的：
－收缩CSS代码
width:calc(100%/3-2*1em-2*1px);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。