171fddba7701e865484bd441ebb1f886934422fe.svn-base 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. /* Flex 布局 */
  2. /* 平行 */
  3. .row,.column {
  4. display: flex;
  5. flex-direction: row;
  6. }
  7. /* 垂直 */
  8. .column {
  9. flex-direction: column;
  10. }
  11. /* 自动填充 */
  12. .col-w,.col-h {
  13. flex: 1;
  14. }
  15. /* 横向 */
  16. .col-w {
  17. width: 0;
  18. }
  19. /* 纵向 */
  20. .col-h {
  21. height: 0;
  22. }
  23. /* 水平垂直居中 */
  24. .center {
  25. justify-content: center;
  26. align-items: center;
  27. }
  28. /* 水平居中 */
  29. .item-center {
  30. align-items: center;
  31. }
  32. /* 垂直居中 */
  33. .vertical-center {
  34. justify-content: center;
  35. }
  36. /* 上对齐 */
  37. .topAlignment {
  38. align-items: flex-strat;
  39. }
  40. /* 右对齐 */
  41. .rightAlignment {
  42. justify-content: flex-end;
  43. }
  44. /* 下对齐 */
  45. .bottomAlignment {
  46. align-items: flex-end;
  47. }
  48. /* 左右对齐,项目之间的间隔都相等 */
  49. .allAlignment {
  50. justify-content: space-between;
  51. }
  52. /* 每个项目两侧的间隔相等。所以,项目之间的间隔比项目与边框的间隔大一倍 */
  53. .average {
  54. justify-content: space-around;
  55. }
  56. /* 项目的第一行文字的基线对齐 */
  57. .items-baseline {
  58. align-items: baseline;
  59. }
  60. /* 省略号 */
  61. .ellipsis{
  62. overflow: hidden;
  63. text-overflow:ellipsis;
  64. white-space: nowrap;
  65. }
  66. body{
  67. margin: 0;
  68. padding: 0;
  69. }
  70. /* 取消苹果的safari浏览器下点击出现高亮效果 */
  71. *{
  72. -webkit-tap-highlight-color:rgba(0,0,0,0)
  73. }
  74. /* 赔率变低 */
  75. .reduce_color{
  76. background:red !important;
  77. color:#fff;
  78. /* animation:mymove1 5s linear 0s 1;
  79. -webkit-animation:mymove1 5s linear 0s 1; */
  80. }
  81. /* 赔率增高 */
  82. .increased_color{
  83. background:Lightgreen !important;
  84. color:#fff;
  85. /* animation:mymove 5s linear 0s 1;
  86. -webkit-animation:mymove 5s linear 0s 1;Safari and Chrome */
  87. }