| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- $header-height: 120rpx;
- $header-top-height: 50rpx;
- /* 通用flex布局 */
- .flex-col {
- display: flex;
- flex-direction: column;
- }
- .flex-row {
- display: flex;
- flex-direction: row;
- }
- .flex-wrap {
- display: flex;
- flex-wrap: wrap;
- }
- .justify-start {
- display: flex;
- justify-content: flex-start;
- }
- .justify-center {
- display: flex;
- justify-content: center;
- }
- .justify-end {
- display: flex;
- justify-content: flex-end;
- }
- .justify-evenly {
- display: flex;
- justify-content: space-evenly;
- }
- .justify-around {
- display: flex;
- justify-content: space-around;
- }
- .justify-between {
- display: flex;
- justify-content: space-between;
- }
- .align-start {
- display: flex;
- align-items: flex-start;
- }
- .align-center {
- display: flex;
- align-items: center;
- }
- .align-end {
- display: flex;
- align-items: flex-end;
- }
-
- .color-yellow{
- color: #F0BC23;
- }
- .color-red{
- color: #E7000D;
- }
- .color-green{
- color: #45BA00;
- }
- .color-blue{
- color: #004098;
- }
- /* 允许单词内换行,强制换行 */
- .word-break-all {
- word-wrap: break-word;
- word-break: break-all;
- min-width: unset;
- }
- /* 仅在单词间隙换行,更适合中文文本 */
- .word-break-normal {
- word-wrap: break-word;
- word-break: normal;
- white-space: normal;
- min-width: unset;
- }
|