MyProject/Test1.html at master · Akshay201318/MyProject · 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
65
66
67
68
<!DOCTYPE html>
<html>
     <head>
         <title>Accordions</title>
         <meta name="viewport" content="width=device-width , initial-scale=1.0 ">
         <link rel="stylesheet" href="Test.css">
     </head>
     <body>
         <div id="accordion1">
             <div>
                 <h2>Accordion I</h2>
                 <p>You can open any number of items</p>
             </div>
             <div id="items">

                       <button class="accordion" onclick="StyleSheet=display:block">Item 1</button>
                       <div class="item">
                           <p id="item1">
                               Hey! this is the first item.You can also open the next ones.
                           </p>
                        </div>
                        <button class="accordion">Item 2</button>
                       <div class="item">
                           <p>
                               Hey! this is the second item.You can also open the next ones.
                           </p>
                        </div>
                        <button class="accordion">Item 3</button>
                       <div class="item">
                           <p>
                               Hey! this is the Third item and this is the last one.
                           </p>
                        </div>

             </div>

         </div>
         <div id="accordion2">
            <div>
                <h2>Accordion II</h2>
                <p>You can open only one item at a time</p>
            </div>
            <div id="items">

                      <button class="accordion">Item 1</button>
                      <div class="item">
                          <p>
                              Hey! this is the first item.Now if you want to opem the next items, first you have to close this one.
                          </p>
                       </div>
                       <button class="accordion">Item 2</button>
                      <div class="item">
                          <p>
                              Hey! this is the second item.Now if you want to opem the next items, first you have to close this one.
                          </p>
                       </div>
                       <button class="accordion">Item 3</button>
                      <div class="item">
                          <p>
                              Hey! this is the Third item and this is the last one.
                          </p>
                       </div>

            </div>

        </div>
     </body>
</html>