| New file |
| | |
|---|
| | | @import './base.css'; |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | margin: 0 auto; |
|---|
| | | padding: 0; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | font-weight: normal; |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | min-width: 1536px; |
|---|
| | | min-height: 730px; |
|---|
| | | |
|---|
| | | } |
|---|
| | | @media (max-width: 500px) { |
|---|
| | | /*#app { |
|---|
| | | transform: rotate(90deg); !* 当宽度小于600px时，翻转元素 *! |
|---|
| | | }*/ |
|---|
| | | } |
|---|
| | | |
|---|
| | | a, |
|---|
| | | .green { |
|---|
| | | text-decoration: none; |
|---|
| | | color: hsla(160, 100%, 37%, 1); |
|---|
| | | transition: 0.4s; |
|---|
| | | } |
|---|
| | | |
|---|
| | | @media (hover: hover) { |
|---|
| | | a:hover { |
|---|
| | | background-color: hsla(160, 100%, 37%, 0.2); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | @media (min-width: 1024px) { |
|---|
| | | body { |
|---|
| | | display: flex; |
|---|
| | | place-items: center; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | grid-template-columns: 1fr 1fr; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | |
|---|
| | | } |
|---|
| | | .mainDiv{ |
|---|
| | | height: 100vh; |
|---|
| | | width: 100vw; |
|---|
| | | } |
|---|
| | | html,body{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
