html-css-js-practice/js-practice.html at master · zkohi/html-css-js-practice · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>html-css-js-practice</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <link rel="stylesheet" href="js-practice.css">
  </head>
  <body>
    <header class="header">
      <nav class="global-nav">
        <div class="nav-item-text">item text</div>
        <div class="nav-menu-text">change menu text</div>
        <ul>
          <li class="nav-item"><a href="#">item</a></li>
          <li class="nav-menu"><a href="#">change menu</a></li>
        </ul>
      </nav>
    </header>
    <div class="wrapper clearfix">
      <main class="main">
        <h2 class="main-title">
          What is Ruby
        </h2>
        <section class="contents">
          This is text1.  This is text1.  This is text1.  This is text1.  This is text1.  This is text1. This is text1. This is text1. This is text1. This is text1. This is text1.
        </section>
        <section class="contents">
          This is text2.  This is text2.  This is text2.  This is text2.  This is text2.  This is text2. This is text2. This is text2. This is text2. This is text2. This is text2.
        </section>
        <section class="contents">
          This is text3.  This is text3.  This is text3.  This is text3.  This is text3.  This is text3. This is text3. This is text3. This is text3. This is text3. This is text3.
        </section>
        <section class="contents">
          This is text4.  This is text4.  This is text4.  This is text4.  This is text4.  This is text4. This is text4. This is text4. This is text4. This is text4. This is text4.
        </section>
        <section class="contents">
          This is text5.  This is text5.  This is text5.  This is text5.  This is text5.  This is text5. This is text5. This is text5. This is text5. This is text5. This is text5.
        </section>
      </main>
      <div class="sidemenu">
        <ul class="list">
          <li>Ruby</li>
          <li>Java</li>
          <li>C#</li>
          <li>Objective-C</li>
          <li>javaScript</li>
        </ul>
      </div>
    </div>
    <footer class="footer">
    </footer>
    <div class="fixed-box">
      <div class="inner">
        <a id="topLink" href="#">scroll top</a>
      </div>
      <div class="inner" id="bottomLink">
        <a id="#bottomLink"><a href="#">scroll bottom</a>
      </div>
    </div>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="js-practice.js"></script>
  </body>
</html>