老师,这样可以吗

来源:3-13 编程练习

常师傅666

2019-01-08 18:27:00

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

      /*在此处补充代码*/

      header{

          display:flex;

          width:100%;

          height:70px;

          background:black;

          justify-content:space-around;

          flex-wrap:wrap;

          align-items:center;

      }

      ul{

          display:flex;

          list-style-type:none;

          justify-content:space-around;

          flex-wrap:wrap;

          align-items:center;

          width:50%;

      }

      li{

          

          float:left;

          color:#fff;

      }

      .login{

          display:flex;

          justify-content:space-around;

          flex-wrap:wrap;

          align-items:center;

          width:10%;

      }

      .login>input{

          background:orange;

          border:none;

          color:#fff;

          border-radius:5px;

      }

    </style>

</head>

<body>

   <header>

     <div class="logo">

       <img src="http://climg.mukewang.com/59feb59700019dab01910057.png" alt="">

     </div>

       <ul class="nav">

         <li>课程</li>

         <li>路径</li>

         <li>猿问</li>

         <li>手记</li>

       </ul>     

     <div class="login">

       <input type="button" value="登录">

       <input type="button" value="注册">

     </div>

   </header>

</body>

</html>


写回答

1回答

好帮手慕星星

2019-01-08

你好,代码实现整体效果是可以的。还可以完善一些:

1、样式开始处可以使用通配符(*)清除所有标签的内外边距。

2、中间导航宽度有些大了,可以设置30%左右。

3、将按钮的宽高可以适当增加一些。

祝学习愉快!

0

0 学习 · 5012 问题

查看课程