html颜色代码生成器,RGB颜色生成器

CSS

语言：

CSSSCSS

确定

body,

html {

width: 100%;

height: 100%;

}

body {

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

}

.wrapper {

height: 100%;

display: -webkit-box;

display: -moz-box;

display: -ms-flexbox;

display: -webkit-flex;

display: flex;

-webkit-flex-direction: column;

-ms-flex-direction: column;

flex-direction: column;

-webkit-align-content: flex-end;

-ms-align-content: flex-end;

align-content: flex-end;

}

#top_portion {

height: 100%;

display: -webkit-box;

display: -moz-box;

display: -ms-flexbox;

display: -webkit-flex;

display: flex;

}

#col1,

#col2,

#col3,

#col4 {

width: 25%;

height: 100%;

display: -webkit-box;

display: -moz-box;

display: -ms-flexbox;

display: -webkit-flex;

display: flex;

-webkit-flex-direction: column;

-ms-flex-direction: column;

flex-direction: column;

-webkit-justify-content: center;

-ms-justify-content: center;

justify-content: center;

-webkit-align-items: center;

-ms-align-items: center;

align-items: center;

}

#col1 {

background: #99b1ad;

}

#col2 {

background: #8aa29f;

}

#col3 {

background: #374d47;

}

#col4 {

background: #e6dcc0;

}

a {

border-radius: 5px;

border: 1px solid white;

color: black;

background: rgba(255, 255, 255, 0.3);

padding: 10px;

width: 50%;

font-size: 13px;

font-weight: 400;

text-align: center;

text-decoration: none;

}

footer {

height: 15%;

width: 100%;

background: white;

text-align: center;

color: #505956;

}

footer h1 {

font-size: 30px;

}

footer p,

footer h1 {

position: relative;

top: 31%;

-webkit-transform: translateY(-50%);

-ms-transform: translateY(-50%);

transform: translateY(-50%);

}