zoukankan      html  css  js  c++  java
  • html5 流式布局 弹式布局 flex

     

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>练习 网站导航</title>
        <style>
                  *{
      margin:0;
      padding:0;
      list-style:none;}
      /* 流式布局
      header{
      height:300px;
      80%;
     
      margin:0 auto;}

      section{
      float:left;
     
      height:300px;
      33.333%;}
      section:first-child{
     
      }
      section:last-child{
      }
      */
      /*  flex  弹式布局
      display:flex;
      */
      header{
      height:300px;
      80%;
     
      margin:0 auto;
      display:-webkit-flex;}
        section{
      float:left;
     
      height:300px;
      -webkit-flex:1;}
         section:first-child{
     
      -webkit-flex:2
      }
      section:last-child{
     
      -webkit-flex:1;}
      
        </style>
         <script src="js/jquery-3.3.1.js"></script>
    </head>
    <body>
    <header>
        <section></section>
            <section></section>
            <section></section>
        </header>
        <script>
    $(document).ready(function(e) {
               
            });
        </script>
    </body>
    </html>
  • 相关阅读:
    豆豆
    艺术家
    姐姐
    书名与歌名
    MySQL
    杂文
    武侠
    青年诗人
    那些歌
    传世
  • 原文地址:https://www.cnblogs.com/lsongyang/p/10618219.html
Copyright © 2011-2022 走看看