1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- html,body{
- width: 100%;
- height: 100%;
- font-family: "微软雅黑";
- }
- #app{
- max-width: 450px!important;
- min-width: 320px!important;
- margin: 0 auto;
- }
- header {
- width: 100%;
- height: 60px;
- background-color: #141414;
- display: flex;
- justify-content: center;
- align-items: center;
- }
- header > div {
- width: 92%;
- height: 24px;
- display: flex;
- justify-content: space-between;
- }
- #app > header > div > h2 {
- margin: 0;
- padding: 0;
- display: flex;
- justify-content: center;
- align-items: center;
- color: #ffffff;
- font-size: 22px;
- }
- header > div > a {
- display: flex;
- }
- header > div>a.left{
- display: flex;
- width: 24px;
- height: 24px;
- }
- header > div>a.right{
- display: flex;
- width: 24px;
- height: 24px;
- }
- footer {
- display: flex;
- flex-direction: column;
- width: 100%;
- height: 90px;
- background-color: #141414;
- }
- footer > .callme {
- display: flex;
- justify-content: space-between;
- width: 100%;
- height: 64px;
- border-bottom: 1px solid #2c2c2c;
- padding-left: 8%;
- }
- footer > .callme > .telphone {
- display: flex;
- flex-direction: column;
- justify-content: center;
- padding-left: 10px;
- }
- footer > .callme > .telphone > p {
- font-size: 15px;
- color: #ffffff;
- margin-bottom: 6px;
- }
- footer > .callme > .telphone > span {
- font-size: 17px;
- color: #ffffff;
- }
- footer > .callme > .online {
- display: flex;
- height: 100%;
- }
- footer > .callme > .online > img {
- display: flex;
- height: 100%;
- }
- footer > .copy {
- display: flex;
- flex: 1;
- justify-content: center;
- align-items: center;
- width: 100%;
- }
- footer > .copy > span {
- font-size: 12px;
- color: #ffffff;
- }
|