Guest User

Untitled

a guest
Jul 20th, 2018
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.05 KB | None | 0 0
  1. /*
  2. Grids Layout for Taobao
  3. */
  4.  
  5. /* require(grids.css) */
  6.  
  7. /*
  8. 淘宝采用了 6 种栅格布局:
  9. 950 .grid-m
  10. 190 750 .grid-s5m0
  11. 750 190 .grid-m0s5
  12. 190 510 230 .grid-s5m0e6
  13. 230 510 190 .grid-e6m0s5
  14. 510 230 190 .grid-m0e6s5
  15. */
  16.  
  17. /** 两栏布局 **/
  18. .grid-s5m0 .main-wrap { margin-left: 200px; }
  19. .grid-s5m0 .col-sub { width: 190px; margin-left: -100%; }
  20.  
  21. .grid-m0s5 .main-wrap { margin-right: 200px; }
  22. .grid-m0s5 .col-sub { width: 190px; margin-left: -190px; }
  23.  
  24. /** 三栏布局 **/
  25. .grid-s5m0e6 .main-wrap { margin: 0 240px 0 200px; }
  26. .grid-s5m0e6 .col-sub { width: 190px; margin-left: -100%; }
  27. .grid-s5m0e6 .col-extra { width: 230px; margin-left: -230px; }
  28.  
  29. .grid-e6m0s5 .main-wrap { margin: 0 200px 0 240px; }
  30. .grid-e6m0s5 .col-sub { width: 190px; margin-left: -190px; }
  31. .grid-e6m0s5 .col-extra { width: 230px; margin-left: -100%; }
  32.  
  33. .grid-m0e6s5 .main-wrap { margin-right: 440px; }
  34. .grid-m0e6s5 .col-sub { width: 190px; margin-left: -190px; }
  35. .grid-m0e6s5 .col-extra { width: 230px; margin-left: -430px; }
Add Comment
Please, Sign In to add comment