请老师帮忙检查一下,谢谢。

来源:3-10 编程练习

幻城163630

2020-06-08 21:13:37

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

      /*在此处补充代码*/

      header{

          display:flex;

          align-items:center;

          background:black;

          justify-content: space-around;

          color:white;

      }

      .nav{

        display:flex;

        width:300px;

        justify-content: space-around;

        list-style:none;

      }

      .login{

        display:flex;

        width:100px;

        justify-content: space-around;

      }

      input[type='button']{

          background:orange;

          border:none;

          border-radius:3px;

          color:white;

      }

    </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回答

好帮手慕久久

2020-06-09

同学你好,代码大体正确,有如下问题可以优化:

ul标签的默认边距,会影响li布局,如下:

http://img.mukewang.com/climg/5edef1ea09f6aa6004710139.jpg

建议使用通配符选择器,去掉所有元素的边距,如下:

http://img.mukewang.com/climg/5edf40c60918538404980115.jpg

2. 去掉边距后,登录和注册按钮由于缺少边距,样式不好看,建议添加上,如下:

http://img.mukewang.com/climg/5edf40d109d4dca305540252.jpg

http://img.mukewang.com/climg/5edf40e20980adc505540163.jpg

如果我的回答帮到了你,欢迎采纳,祝学习愉快!

0

0 学习 · 6815 问题

查看课程