|
|
Line 7: |
Line 7: |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Team:NUDT_CHINA</title> | | <title>Team:NUDT_CHINA</title> |
− |
| + | |
− | <style type="text/css">
| + | |
− | .pure-g{
| + | |
− | letter-spacing:-.31em;text-rendering:optimizespeed;
| + | |
− | font-family:FreeSans,Arimo,"Droid Sans",Helvetica,Arial,sans-serif;
| + | |
− | display:-webkit-box;
| + | |
− | display:-webkit-flex;
| + | |
− | display:-ms-flexbox;
| + | |
− | display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-align-content:flex-start;-ms-flex-line-pack:start;
| + | |
− | align-content:flex-start}
| + | |
− | @media all and (-ms-high-contrast:none),(-ms-high-contrast:active){table .pure-g{display:block}}
| + | |
− | .opera-only :-o-prefocus,.pure-g{word-spacing:-.43em}
| + | |
− | .pure-u,.pure-u-1,.pure-u-1-1,.pure-u-1-12,.pure-u-1-2,.pure-u-1-24,.pure-u-1-3,.pure-u-1-4,.pure-u-1-5,.pure-u-1-6,.pure-u-1-8,.pure-u-10-24,.pure-u-11-12,.pure-u-11-24,.pure-u-12-24,.pure-u-13-24,.pure-u-14-24,.pure-u-15-24,.pure-u-16-24,.pure-u-17-24,.pure-u-18-24,.pure-u-19-24,.pure-u-2-24,.pure-u-2-3,.pure-u-2-5,.pure-u-20-24,.pure-u-21-24,.pure-u-22-24,.pure-u-23-24,.pure-u-24-24,.pure-u-3-24,.pure-u-3-4,.pure-u-3-5,.pure-u-3-8,.pure-u-4-24,.pure-u-4-5,.pure-u-5-12,.pure-u-5-24,.pure-u-5-5,.pure-u-5-6,.pure-u-5-8,.pure-u-6-24,.pure-u-7-12,.pure-u-7-24,.pure-u-7-8,.pure-u-8-24,.pure-u-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}
| + | |
− | .pure-g [class*=pure-u]{font-family:sans-serif}
| + | |
− | .pure-u-1-24{width:4.1667%}
| + | |
− | .pure-u-1-12,.pure-u-2-24{width:8.3333%}
| + | |
− | .pure-u-1-8,.pure-u-3-24{width:12.5%}
| + | |
− | .pure-u-1-6,.pure-u-4-24{width:16.6667%}
| + | |
− | .pure-u-1-5{width:20%}
| + | |
− | .pure-u-5-24{width:20.8333%}
| + | |
− | .pure-u-1-4,.pure-u-6-24{width:25%}
| + | |
− | .pure-u-7-24{width:29.1667%}
| + | |
− | .pure-u-1-3,.pure-u-8-24{width:33.3333%}
| + | |
− | .pure-u-3-8,.pure-u-9-24{width:37.5%}
| + | |
− | .pure-u-2-5{width:40%}
| + | |
− | .pure-u-10-24,.pure-u-5-12{width:41.6667%}
| + | |
− | .pure-u-11-24{width:45.8333%}
| + | |
− | .pure-u-1-2,.pure-u-12-24{width:50%}
| + | |
− | .pure-u-13-24{width:54.1667%}
| + | |
− | .pure-u-14-24,.pure-u-7-12{width:58.3333%}
| + | |
− | .pure-u-3-5{width:60%}
| + | |
− | .pure-u-15-24,.pure-u-5-8{width:62.5%}
| + | |
− | .pure-u-16-24,.pure-u-2-3{width:66.6667%}
| + | |
− | .pure-u-17-24{width:70.8333%}
| + | |
− | .pure-u-18-24,.pure-u-3-4{width:75%}
| + | |
− | .pure-u-19-24{width:79.1667%}
| + | |
− | .pure-u-4-5{width:80%}
| + | |
− | .pure-u-20-24,.pure-u-5-6{width:83.3333%}
| + | |
− | .pure-u-21-24,.pure-u-7-8{width:87.5%}
| + | |
− | .pure-u-11-12,.pure-u-22-24{width:91.6667%}
| + | |
− | .pure-u-23-24{width:95.8333%}
| + | |
− | .pure-u-1,.pure-u-1-1,.pure-u-24-24,.pure-u-5-5{width:100%}
| + | |
− | @media screen and (min-width:0em){.pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-1-12,.pure-u-sm-1-2,.pure-u-sm-1-24,.pure-u-sm-1-3,.pure-u-sm-1-4,.pure-u-sm-1-5,.pure-u-sm-1-6,.pure-u-sm-1-8,.pure-u-sm-10-24,.pure-u-sm-11-12,.pure-u-sm-11-24,.pure-u-sm-12-24,.pure-u-sm-13-24,.pure-u-sm-14-24,.pure-u-sm-15-24,.pure-u-sm-16-24,.pure-u-sm-17-24,.pure-u-sm-18-24,.pure-u-sm-19-24,.pure-u-sm-2-24,.pure-u-sm-2-3,.pure-u-sm-2-5,.pure-u-sm-20-24,.pure-u-sm-21-24,.pure-u-sm-22-24,.pure-u-sm-23-24,.pure-u-sm-24-24,.pure-u-sm-3-24,.pure-u-sm-3-4,.pure-u-sm-3-5,.pure-u-sm-3-8,.pure-u-sm-4-24,.pure-u-sm-4-5,.pure-u-sm-5-12,.pure-u-sm-5-24,.pure-u-sm-5-5,.pure-u-sm-5-6,.pure-u-sm-5-8,.pure-u-sm-6-24,.pure-u-sm-7-12,.pure-u-sm-7-24,.pure-u-sm-7-8,.pure-u-sm-8-24,.pure-u-sm-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}
| + | |
− | .pure-u-sm-1-24{width:4.1667%}
| + | |
− | .pure-u-sm-1-12,.pure-u-sm-2-24{width:8.3333%}
| + | |
− | .pure-u-sm-1-8,.pure-u-sm-3-24{width:12.5%}
| + | |
− | .pure-u-sm-1-6,.pure-u-sm-4-24{width:16.6667%}
| + | |
− | .pure-u-sm-1-5{width:20%}
| + | |
− | .pure-u-sm-5-24{width:20.8333%}
| + | |
− | .pure-u-sm-1-4,.pure-u-sm-6-24{width:25%}
| + | |
− | .pure-u-sm-7-24{width:29.1667%}
| + | |
− | .pure-u-sm-1-3,.pure-u-sm-8-24{width:33.3333%}
| + | |
− | .pure-u-sm-3-8,.pure-u-sm-9-24{width:37.5%}
| + | |
− | .pure-u-sm-2-5{width:40%}
| + | |
− | .pure-u-sm-10-24,.pure-u-sm-5-12{width:41.6667%}
| + | |
− | .pure-u-sm-11-24{width:45.8333%}
| + | |
− | .pure-u-sm-1-2,.pure-u-sm-12-24{width:50%}
| + | |
− | .pure-u-sm-13-24{width:54.1667%}
| + | |
− | .pure-u-sm-14-24,.pure-u-sm-7-12{width:58.3333%}
| + | |
− | .pure-u-sm-3-5{width:60%}
| + | |
− | .pure-u-sm-15-24,.pure-u-sm-5-8{width:62.5%}
| + | |
− | .pure-u-sm-16-24,.pure-u-sm-2-3{width:66.6667%}
| + | |
− | .pure-u-sm-17-24{width:70.8333%}
| + | |
− | .pure-u-sm-18-24,.pure-u-sm-3-4{width:75%}
| + | |
− | .pure-u-sm-19-24{width:79.1667%}
| + | |
− | .pure-u-sm-4-5{width:80%}
| + | |
− | .pure-u-sm-20-24,.pure-u-sm-5-6{width:83.3333%}
| + | |
− | .pure-u-sm-21-24,.pure-u-sm-7-8{width:87.5%}
| + | |
− | .pure-u-sm-11-12,.pure-u-sm-22-24{width:91.6667%}
| + | |
− | .pure-u-sm-23-24{width:95.8333%}
| + | |
− | .pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-24-24,.pure-u-sm-5-5{width:100%}}
| + | |
− | | + | |
− | @media screen and (min-width:48em){.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-1-12,.pure-u-md-1-2,.pure-u-md-1-24,.pure-u-md-1-3,.pure-u-md-1-4,.pure-u-md-1-5,.pure-u-md-1-6,.pure-u-md-1-8,.pure-u-md-10-24,.pure-u-md-11-12,.pure-u-md-11-24,.pure-u-md-12-24,.pure-u-md-13-24,.pure-u-md-14-24,.pure-u-md-15-24,.pure-u-md-16-24,.pure-u-md-17-24,.pure-u-md-18-24,.pure-u-md-19-24,.pure-u-md-2-24,.pure-u-md-2-3,.pure-u-md-2-5,.pure-u-md-20-24,.pure-u-md-21-24,.pure-u-md-22-24,.pure-u-md-23-24,.pure-u-md-24-24,.pure-u-md-3-24,.pure-u-md-3-4,.pure-u-md-3-5,.pure-u-md-3-8,.pure-u-md-4-24,.pure-u-md-4-5,.pure-u-md-5-12,.pure-u-md-5-24,.pure-u-md-5-5,.pure-u-md-5-6,.pure-u-md-5-8,.pure-u-md-6-24,.pure-u-md-7-12,.pure-u-md-7-24,.pure-u-md-7-8,.pure-u-md-8-24,.pure-u-md-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-md-1-24{width:4.1667%}
| + | |
− | .pure-u-md-1-12,.pure-u-md-2-24{width:8.3333%}
| + | |
− | .pure-u-md-1-8,.pure-u-md-3-24{width:12.5%}
| + | |
− | .pure-u-md-1-6,.pure-u-md-4-24{width:16.6667%}
| + | |
− | .pure-u-md-1-5{width:20%}
| + | |
− | .pure-u-md-5-24{width:20.8333%}
| + | |
− | .pure-u-md-1-4,.pure-u-md-6-24{width:25%}
| + | |
− | .pure-u-md-7-24{width:29.1667%}
| + | |
− | .pure-u-md-1-3,.pure-u-md-8-24{width:33.3333%}
| + | |
− | .pure-u-md-3-8,.pure-u-md-9-24{width:37.5%}
| + | |
− | .pure-u-md-2-5{width:40%}
| + | |
− | .pure-u-md-10-24,.pure-u-md-5-12{width:41.6667%}
| + | |
− | .pure-u-md-11-24{width:45.8333%}
| + | |
− | .pure-u-md-1-2,.pure-u-md-12-24{width:50%}
| + | |
− | .pure-u-md-13-24{width:54.1667%}
| + | |
− | .pure-u-md-14-24,.pure-u-md-7-12{width:58.3333%}
| + | |
− | .pure-u-md-3-5{width:60%}
| + | |
− | .pure-u-md-15-24,.pure-u-md-5-8{width:62.5%}
| + | |
− | .pure-u-md-16-24,.pure-u-md-2-3{width:66.6667%}
| + | |
− | .pure-u-md-17-24{width:70.8333%}.pure-u-md-18-24,.pure-u-md-3-4{width:75%}.pure-u-md-19-24{width:79.1667%}.pure-u-md-4-5{width:80%}.pure-u-md-20-24,.pure-u-md-5-6{width:83.3333%}.pure-u-md-21-24,.pure-u-md-7-8{width:87.5%}.pure-u-md-11-12,.pure-u-md-22-24{width:91.6667%}.pure-u-md-23-24{width:95.8333%}.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-24-24,.pure-u-md-5-5{width:100%}}
| + | |
− | | + | |
− | </style>
| + | |
− | <!-- for the menu and all-->
| + | |
− | <style type="text/css"><!--
| + | |
− | | + | |
− | .pure-menu {
| + | |
− | box-sizing: border-box;
| + | |
− | }
| + | |
− | .pure-menu-fixed {
| + | |
− | position: fixed;
| + | |
− | left: 0;
| + | |
− | top: 0;
| + | |
− | z-index: 3;
| + | |
− | }
| + | |
− | .pure-menu-list,
| + | |
− | .pure-menu-item {
| + | |
− | position: relative;
| + | |
− | }
| + | |
− | | + | |
− | .pure-menu-list {
| + | |
− | list-style: none;
| + | |
− | margin: 0;
| + | |
− | padding: 0;
| + | |
− | }
| + | |
− | | + | |
− | .pure-menu-item {
| + | |
− | padding: 0;
| + | |
− | margin: 0;
| + | |
− | height: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .pure-menu-link,
| + | |
− | .pure-menu-heading {
| + | |
− | display: block;
| + | |
− | text-decoration: none;
| + | |
− | white-space: nowrap;
| + | |
− | }
| + | |
− | .pure-menu-item .pure-menu-item {
| + | |
− | display: block;
| + | |
− | }
| + | |
− | .pure-menu-heading {
| + | |
− | text-transform: uppercase;
| + | |
− | color: #565d64;
| + | |
− | }
| + | |
− | .pure-menu-link, {
| + | |
− | color: #777;
| + | |
− | }
| + | |
− | | + | |
− | .pure-menu-link,
| + | |
− | .pure-menu-heading {
| + | |
− | padding: .5em 1em;
| + | |
− | }
| + | |
− | .pure-menu-active > .pure-menu-link,
| + | |
− | .pure-menu-link:hover,
| + | |
− | .pure-menu-link:focus {
| + | |
− | background-color: #eee;
| + | |
− | }
| + | |
− | .pure-menu-selected .pure-menu-link,
| + | |
− | .pure-menu-selected .pure-menu-link:visited {
| + | |
− | color: #000;
| + | |
− | }
| + | |
− | | + | |
− | body {
| + | |
− | color: #777;
| + | |
− | }
| + | |
− | | + | |
− | .pure-img-responsive {
| + | |
− | max-width: 100%;
| + | |
− | height: auto;
| + | |
− | }
| + | |
− | | + | |
− | #layout,
| + | |
− | #menu,
| + | |
− | .menu-link {
| + | |
− | -webkit-transition: all 0.2s ease-out;
| + | |
− | -moz-transition: all 0.2s ease-out;
| + | |
− | -ms-transition: all 0.2s ease-out;
| + | |
− | -o-transition: all 0.2s ease-out;
| + | |
− | transition: all 0.2s ease-out;
| + | |
− | }
| + | |
− | | + | |
− | #layout {
| + | |
− | position: relative;
| + | |
− | left: 0;
| + | |
− | padding-left: 0;
| + | |
− | }
| + | |
− | #layout.active #menu {
| + | |
− | left: 175px;
| + | |
− | width: 175px;
| + | |
− | }
| + | |
− | | + | |
− | #layout.active .menu-link {
| + | |
− | left: 175px;
| + | |
− | }
| + | |
− | | + | |
− | .content {
| + | |
− | margin: 0 auto;
| + | |
− | padding: 0 2em;
| + | |
− | max-width: 800px;
| + | |
− | margin-bottom: 50px;
| + | |
− | line-height: 1.6em;
| + | |
− | }
| + | |
− | | + | |
− | .header {
| + | |
− | margin: 0;
| + | |
− | color: #333;
| + | |
− | text-align: center;
| + | |
− | padding: 2.5em 2em 0;
| + | |
− | border-bottom: 1px solid #eee;
| + | |
− | } | + | |
− | .header h1 {
| + | |
− | margin: 0.2em 0;
| + | |
− | font-size: 3em;
| + | |
− | font-weight: 300;
| + | |
− | }
| + | |
− | .header h2 {
| + | |
− | font-weight: 300;
| + | |
− | color: #ccc;
| + | |
− | padding: 0;
| + | |
− | margin-top: 0;
| + | |
− | }
| + | |
− | | + | |
− | .content-subhead {
| + | |
− | margin: 50px 0 20px 0;
| + | |
− | font-weight: 190;
| + | |
− | color: #888;
| + | |
− | font-size:200%;
| + | |
− | }
| + | |
− | .content-subsub{
| + | |
− | margin: 50px 0 20px 0;
| + | |
− | font-weight: 300;
| + | |
− | color: #888;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | #menu {
| + | |
− | margin-left: -175px; /* "#menu" width */
| + | |
− | width: 175px;
| + | |
− | position: fixed;
| + | |
− | top: 18px;
| + | |
− | left: 0;
| + | |
− | bottom: 0;
| + | |
− | z-index: 1000; /* so the menu or its navicon stays above all content */
| + | |
− | background: #000000;
| + | |
− | overflow-y: auto;
| + | |
− | -webkit-overflow-scrolling: touch;
| + | |
− | }
| + | |
− | #menu a {
| + | |
− | color: #999;
| + | |
− | border: none;
| + | |
− | padding: 0.6em 0 0.6em 0.6em;
| + | |
− | }
| + | |
− | | + | |
− | /*
| + | |
− | Remove all background/borders, since we are applying them to #menu.
| + | |
− | */
| + | |
− | #menu .pure-menu,
| + | |
− | #menu .pure-menu ul {
| + | |
− | border: none;
| + | |
− | background: transparent;
| + | |
− | }
| + | |
− | | + | |
− | #menu .pure-menu ul,
| + | |
− | #menu .pure-menu .menu-item-divided {
| + | |
− | border-top: 1px solid #333;
| + | |
− | }
| + | |
− | /*
| + | |
− | Change color of the anchor links on hover/focus.
| + | |
− | */
| + | |
− | #menu .pure-menu li a:hover,
| + | |
− | #menu .pure-menu li a:focus {
| + | |
− | background: #333;
| + | |
− | }
| + | |
− |
| + | |
− | #menu .pure-menu-selected,
| + | |
− | #menu .pure-menu-heading {
| + | |
− | background: #1f8dd6;
| + | |
− | }
| + | |
− | #menu .pure-menu-selected a {
| + | |
− | color: #fff;
| + | |
− | }
| + | |
− | | + | |
− | #menu .pure-menu-heading {
| + | |
− | color: #fff;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | .menu-link {
| + | |
− | position: fixed;
| + | |
− | display: block; /* show this only on small screens */
| + | |
− | top: 18px;
| + | |
− | left: 0; /* "#menu width" */
| + | |
− | background: #000;
| + | |
− | background: rgba(0,0,0,0.7);
| + | |
− | font-size: 10px; /* change this value to increase/decrease button size */
| + | |
− | z-index: 10;
| + | |
− | width: 2em;
| + | |
− | height: auto;
| + | |
− | padding: 2.1em 1.6em;
| + | |
− | }
| + | |
− | | + | |
− | .menu-link:hover,
| + | |
− | .menu-link:focus {
| + | |
− | background: #000;
| + | |
− | }
| + | |
− | | + | |
− | .menu-link span {
| + | |
− | position: relative;
| + | |
− | display: block;
| + | |
− | }
| + | |
− | | + | |
− | .menu-link span,
| + | |
− | .menu-link span:before,
| + | |
− | .menu-link span:after {
| + | |
− | background-color: #fff;
| + | |
− | width: 100%;
| + | |
− | height: 0.2em;
| + | |
− | }
| + | |
− | | + | |
− | .menu-link span:before,
| + | |
− | .menu-link span:after {
| + | |
− | position: absolute;
| + | |
− | margin-top: -0.6em;
| + | |
− | content: " ";
| + | |
− | }
| + | |
− | | + | |
− | .menu-link span:after {
| + | |
− | margin-top: 0.6em;
| + | |
− | }
| + | |
− | @media (min-width: 88em) {
| + | |
− | | + | |
− | .header,
| + | |
− | .content {
| + | |
− | padding-left: 2em;
| + | |
− | padding-right: 2em;
| + | |
− | }
| + | |
− | | + | |
− | #layout {
| + | |
− | padding-left: 175px; /* left col width "#menu" */
| + | |
− | left: 0;
| + | |
− | }
| + | |
− | #menu {
| + | |
− | left: 175px;
| + | |
− | }
| + | |
− | | + | |
− | .menu-link {
| + | |
− | position: fixed;
| + | |
− | left: 175px;
| + | |
− | display: none;
| + | |
− | }
| + | |
− | | + | |
− | #layout.active .menu-link {
| + | |
− | left: 175px;
| + | |
− | }
| + | |
− | #listlist .divList{ width:1100px; height:520px; margin:0px auto; position:relative;}
| + | |
− | }
| + | |
− | | + | |
− | @media (max-width: 88em) {
| + | |
− | #layout.active {
| + | |
− | position: relative;
| + | |
− | left: 175px;
| + | |
− | }
| + | |
− | #listlist .divList{ width:900px; height:500px; margin:0px auto; position:relative;}
| + | |
− | }
| + | |
− | .pure-menu-item .pure-menu-item{display:block;background-color:#cccccc}
| + | |
− | .pure-menu-children{display:none;position:relative;top:0;margin:0;padding:0;z-index:3}
| + | |
− | .pure-menu-active>.pure-menu-children,.pure-menu-allow-hover:hover>.pure-menu-children{display:block;position:relative}
| + | |
− | .pure-menu-has-children>.pure-menu-link:after{padding-left:.5em;content:"\25B8";font-size:small}
| + | |
− | | + | |
− | -->
| + | |
− | </style>
| + | |
| | | |
| </head> | | </head> |