property.css 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. /*
  2. * 面向属性的 CSS
  3. */
  4. /* 布局方式 */
  5. .df { display: flex; }
  6. .f1{
  7. flex: 1;
  8. }
  9. .fn{
  10. flex: none;
  11. }
  12. .aic{
  13. align-items: center;
  14. }
  15. .jcc{
  16. justify-content: center;
  17. }
  18. .fdc{
  19. flex-direction: column;
  20. }
  21. .jcsb{
  22. justify-content: space-between;
  23. }
  24. .jcsa{
  25. justify-content:space-around
  26. }
  27. .asc{
  28. align-self: center;
  29. }
  30. .dpb{
  31. display: block;
  32. }
  33. .shadow{
  34. box-shadow: 2px 2px 5px #ccc;
  35. }
  36. .ofs{
  37. overflow-y: scroll;
  38. }
  39. .dpnone { display: none; }
  40. /* 盒模型 */
  41. .mt0 { margin-top: 0; }
  42. .mt8 { margin-top: 8px; }
  43. .mt10{
  44. margin-top: 10px;
  45. }
  46. .mt16 { margin-top: 16px; }
  47. .mt20 { margin-top: 20px; }
  48. .mb20{
  49. margin-bottom: 20px;
  50. }
  51. .br15{
  52. border-radius: 15px;
  53. }
  54. .mt40 { margin-top: 40px; }
  55. .mr16 { margin-right: 16px; }
  56. .mb16 { margin-bottom: 16px; }
  57. .ml12 { margin-left: 12px; }
  58. .bgw{
  59. background-color: #fff;
  60. }
  61. .pd16 { padding: 16px; }
  62. .p20{
  63. padding: 20px;
  64. }
  65. .pl8 { padding-left: 8px; }
  66. /* 字号 */
  67. .fs12 { font-size: 12px; }
  68. .fs18 { font-size: 18px; }
  69. .elli{
  70. overflow: hidden;
  71. text-overflow:ellipsis;
  72. white-space: nowrap;
  73. }