calc()函数在圣杯布局中用法

来源:7-3 圣杯布局的解决方案

慕粉3959400

2020-01-02 03:10

如果不考虑兼容的情况下,发现使用calc()也可以实现同样的效果,和大家分享一下:


写回答 关注

1回答

  • 慕粉3959400
    2020-01-02 03:16:47
    <!--还是左中右的顺序-->
    <div class="parent">
      <div class="left"></div>
      <div class="center"></div>
      <div class="right"></div>
    </div>
    .left, .center, .right {     
        height: 300px;
        float: left;
    }        
    .left { 
        background-color: red; 
        width: 300px;
    }        
    .center { 
        background-color: green;
        width: calc(100% - 600px);
    }        
    .right { 
        background-color: blue;
        width: 300px;        
    }


一课全面掌握主流CSS布局

一网打尽CSS主流布局方案,一步掌握页面布局技巧.

5276 学习 · 60 问题

查看课程

相似问题