请问我想做成图片上那样，可是为什么不对，跟之前做的不是就差一了一些图片和文字嘛，删了不就行了吗，还是我这样是不对的，要怎么改正


1<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=devic>e-width, initial-scale=1.0">
    
    <title>网页设计软件列表</title>
</head>
<body>
    <h2>网页设计软件列表（单击查看）</h2>
    <hr size="3"color="#5E2D00"width="750px">
    <nav>
        <a href="#news1" class="one">Photoshop软件</a>
        <a href="#news2" class="two">illustrator软件</a>
        <a href="#news3" class="two">Dreamweaver软件</a>
        <a href="#news4" class="two">Fireworks软件</a>
    </nav>
    <hr size="3"color="#5E2D00" width="750px">
</body>
</html>

img

flex布局，加左右内边距


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=devic>e-width, initial-scale=1.0">

    <title>网页设计软件列表</title>
<style>
  
  nav{
  padding:0 15px;
  display:flex;
  justify-content:space-between;
  
  }
  nav a{
  color:#5E2D00;
  }
</style>
  </head>
  <body>
    <h2>网页设计软件列表（单击查看）</h2>
    <hr size="3" color="#5E2D00">
    <nav>
      <a href="#news1" class="one">Photoshop软件</a>
      <a href="#news2" class="two">illustrator软件</a>
      <a href="#news3" class="two">Dreamweaver软件</a>
      <a href="#news4" class="two">Fireworks软件</a>
    </nav>
    <hr size="3" color="#5E2D00">
  </body>
</html>
 
   


 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=devic>e-width, initial-scale=1.0">
 
    <title>网页设计软件列表</title>
<style>
  body>div{
    width: 750px;
    margin: 0 auto;
  }
  nav{
    padding:0 15px;
    display:flex;
    justify-content:space-between;
  }
  nav a{
    color:#5E2D00;
    text-decoration: none;
  }
  h2{
    text-align: center;
  }
</style>
  </head>
  <body>
    <div>
        <h2>网页设计软件列表（单击查看）</h2>
        <hr size="3" color="#5E2D00">
        <nav>
          <a href="#news1" class="one">Photoshop软件</a>
          <a href="#news2" class="two">illustrator软件</a>
          <a href="#news3" class="two">Dreamweaver软件</a>
          <a href="#news4" class="two">Fireworks软件</a>
        </nav>
        <hr size="3" color="#5E2D00">
    </div>
  </body>
</html>