Difference between revisions of "Team:ASTWS-China/test"

 
(4 intermediate revisions by the same user not shown)
Line 63: Line 63:
 
             }
 
             }
 
              
 
              
             #menu {
+
             .menu {
 
                 list-style-image: none;
 
                 list-style-image: none;
 
             }
 
             }
/*
 
            .menu::before {
 
                float:left;
 
                position: relative;
 
                content:"";
 
                width: 250px;
 
                height: 100px;
 
            }
 
*/
 
 
              
 
              
 
             /* Button */
 
             /* Button */
Line 136: Line 127:
 
                 background-color: rgb(152,193,147);
 
                 background-color: rgb(152,193,147);
 
             }
 
             }
              
+
             .menu .icon {
            @media screen and (max-width: 1000px) {
+
                 display: none;
              .menu a:not(:first-child) {display: none;}
+
              .menu a.icon {
+
                float: right;
+
                 display: block;
+
              }
+
 
             }
 
             }
 
              
 
              
 
             @media screen and (max-width: 1000px) {
 
             @media screen and (max-width: 1000px) {
                 .menu a.icon {
+
                 .menu li{
                float: right;
+
                    display: block;
                display: block;
+
                }
              }
+
               
 +
                .menu li ul li a.icon {
 +
                    float: right;
 +
                    display: block;
 +
                }
 
             }
 
             }
 
              
 
              
 
             @media screen and (max-width: 1000px) {
 
             @media screen and (max-width: 1000px) {
              .menu.responsive {position: relative;}
+
                .menu.responsive li {position: relative;}
              .menu.responsive .icon {
+
                .menu.responsive li ul li a.icon {
                position: absolute;
+
                    position: absolute;
                right: 0;
+
                    right: 0;
                top: 0;
+
                    top: 0;
              }
+
                }
              .menu.responsive a {
+
                .menu.responsive li a {
                 float: none;
+
                    float: none;
                 display: block;
+
                    display: block;
                text-align: left;
+
                    text-align: center;
              }
+
                 }
 +
               
 +
                .menu.responsive li {
 +
                    float: none;
 +
                 }
 +
                .menu.responsive li ul {
 +
                    position: relative;
 +
                }
 +
                .menu.responsive li ul li a{
 +
                    display: block;
 +
                    width: 100%;
 +
                    text-align: center;
 +
                }
 
             }
 
             }
 
              
 
              
Line 171: Line 173:
 
             function myFunction() {
 
             function myFunction() {
 
                 var x = document.getElementById("mymenu");
 
                 var x = document.getElementById("mymenu");
                 if (x.className === "menu") {
+
                 if (x.className === "menu li") {
 
                     x.className += " responsive";
 
                     x.className += " responsive";
                 } else {
+
                 }  
                     x.className = "menu";
+
                else {
 +
                     x.className = "menu li";
 
                 }
 
                 }
 
             }
 
             }
Line 228: Line 231:
 
             </div>
 
             </div>
 
         </div>
 
         </div>
      
+
       
 +
     <h1>This is a test case.</h1>
 
     </body>
 
     </body>
  
 
</html>
 
</html>

Latest revision as of 00:17, 18 October 2018

This is a test case.