html 全屏状态栏,HTML5 全屏菜单

CSS

语言：

CSSSCSS

确定

@import url(http://fonts.googleapis.com/css?family=Oswald:400,700,300);

body, html {

background: #222;

font-family: 'Oswald', sans-serif;

height: 100%;

margin: 0;

padding: 0 0;

position: relative;

width: 100%; }

span.main {

bottom: 0;

color: #fff;

cursor: pointer;

display: block;

font-size: 21px;

font-weight: 400;

height: 50px;

left: 0;

margin: auto;

position: absolute;

right: 0;

text-transform: uppercase;

top: 0;

width: 50px;

z-index: 100; }

#fullscreen {

background: rgba(0, 0, 0, .9);

bottom: 0;

border-radius: 3px;

color: #fff;

display: block;

height: 90%;

left: 0;

margin: auto;

opacity: 0;

right: 0;

top: 0;

position: absolute;

width: 90%;

z-index: 50; }

#fullscreen .close {

color: #fff;

cursor: pointer;

font-size: 21px;

position: absolute;

right: 15px;

top: 15px; }

.left {

display: block;

height: 50%;

width: 30%;

margin: 3%; }

#fullscreen h1 {

color: #fff;

font-weight: 300;

font-size: 57px;

text-transform: uppercase;

text-align: center; }