Question

我正在克隆这个设计的左图：

https://dribbble.com/shots/2262761-Mobile-Blog-App-Interface/attachments/424147

这是我的代码：

https://codepen.io/TheKyleDev/project/full/ZWbLbw

代码：https://codepen.io/TheKyleDev/project/editor/ZWbLbw

    <!DOCTYPE html>
    <html>
    <head>
      <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,700" rel="stylesheet">
      <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
      <header class="hero">
        <h4>Mark Manson</h4>
        <h1>The<br />Dark Side<br />of the<br />Digital<br />Nomad</h1>

        <div class="btn"><a href="#">Travel</a></div>
      </header>
      <footer>
        <p class="close-btn">Close</p>
        <div class="dots-container">
          <div class="dot"></div>
          <div class="dot"></div>
          <div class="dot active"></div>
          <div class="dot"></div>
        </div>
        <p class="chat">Chat</p>
      </footer>
    </body>
    </html>

我想要了解如何改进这一点，它有什么不好以及我的编码方式。

Answer 1

在head标记之间添加<title>标记。

克隆运球布局。我是怎么做的，有什么需要改进的？

1 个答案: