如何在CSS中并排创建两个高度相同的div元素
答:用法CSS3 flexbox

    用法CSS3 flex布局模型,您可以轻松地创建等高的列或并排对齐的元素。只需在容器元素上应用display带有值flex的flex属性,在子元素上应用值为1的属性。

     

    让我们尝试以下示例以了解其基本工作原理:

     

    例试试这个代码»

   


   

   

   

    Creating Two Equal Height Columns with CSS

   

    .flex-container{

        width: 80%;

        min-height: 300px;

        margin: 0 auto;

        display: -webkit-flex; /* Safari */     
flex布局对齐方式
        display: flex; /* Standard syntax */

    }

    .flex-container .column{

        padding: 10px;

        background: dbdfe5;


        -webkit-flex: 1; /* Safari */

        -ms-flex: 1; /* IE 10 */

        flex: 1; /* Standard syntax */

    }

    .flex-container .column.bg-alt{

        background: b4bac0;

    }

   

   

   

       

            Column 1

            Column 2

       

   


   

     

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