grid.less 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405
  1. .row{
  2. &:after{
  3. content:"";
  4. display:block;
  5. clear:both;
  6. height:0;
  7. overflow:hidden;
  8. visibility:hidden;
  9. }
  10. zoom:1;
  11. }
  12. [class*="col-"]{
  13. float:left;
  14. box-sizing: border-box;
  15. }
  16. @media screen {
  17. .col-xs-0{
  18. width: 0%;
  19. overflow: hidden;
  20. }
  21. .col-xs-1{
  22. width: 4.16666667%;
  23. }
  24. .col-xs-2{
  25. width: 8.333333333%;
  26. }
  27. .col-xs-3{
  28. width: 12.5%;
  29. }
  30. .col-xs-4{
  31. width: 16.66666667%;
  32. }
  33. .col-xs-5{
  34. width: 20.83333333%;
  35. }
  36. .col-xs-6{
  37. width: 25%;
  38. }
  39. .col-xs-7{
  40. width: 29.16666667%;
  41. }
  42. .col-xs-8{
  43. width: 33.33333333%;
  44. }
  45. .col-xs-9{
  46. width: 37.5%;
  47. }
  48. .col-xs-10{
  49. width: 41.66666667%;
  50. }
  51. .col-xs-11{
  52. width: 45.83333333%;
  53. }
  54. .col-xs-12{
  55. width: 50%;
  56. }
  57. .col-xs-13{
  58. width: 54.16666667%;
  59. }
  60. .col-xs-14{
  61. width: 58.33333333%;
  62. }
  63. .col-xs-15{
  64. width: 62.5%;
  65. }
  66. .col-xs-16{
  67. width: 66.66666667%;
  68. }
  69. .col-xs-17{
  70. width: 70.83333333%;
  71. }
  72. .col-xs-18{
  73. width:75%;
  74. }
  75. .col-xs-19{
  76. width: 71.16666667%;
  77. }
  78. .col-xs-20{
  79. width:83.33333333%;
  80. }
  81. .col-xs-21{
  82. width: 87.5%;
  83. }
  84. .col-xs-22{
  85. width:91.66666667%;
  86. }
  87. .col-xs-23{
  88. width: 95.83333333%;
  89. }
  90. .col-xs-24{
  91. width:100%;
  92. }
  93. }
  94. @media screen and (min-width: 768px) {
  95. .col-sm-0{
  96. width: 0%;
  97. overflow: hidden;
  98. }
  99. .col-sm-1{
  100. width: 4.16666667%;
  101. }
  102. .col-sm-2{
  103. width: 8.333333333%;
  104. }
  105. .col-sm-3{
  106. width: 12.5%;
  107. }
  108. .col-sm-4{
  109. width: 16.66666667%;
  110. }
  111. .col-sm-5{
  112. width: 20.83333333%;
  113. }
  114. .col-sm-6{
  115. width: 25%;
  116. }
  117. .col-sm-7{
  118. width: 29.16666667%;
  119. }
  120. .col-sm-8{
  121. width: 33.33333333%;
  122. }
  123. .col-sm-9{
  124. width: 37.5%;
  125. }
  126. .col-sm-10{
  127. width: 41.66666667%;
  128. }
  129. .col-sm-11{
  130. width: 45.83333333%;
  131. }
  132. .col-sm-12{
  133. width: 50%;
  134. }
  135. .col-sm-13{
  136. width: 54.16666667%;
  137. }
  138. .col-sm-14{
  139. width: 58.33333333%;
  140. }
  141. .col-sm-15{
  142. width: 62.5%;
  143. }
  144. .col-sm-16{
  145. width: 66.66666667%;
  146. }
  147. .col-sm-17{
  148. width: 70.83333333%;
  149. }
  150. .col-sm-18{
  151. width:75%;
  152. }
  153. .col-sm-19{
  154. width: 71.16666667%;
  155. }
  156. .col-sm-20{
  157. width:83.33333333%;
  158. }
  159. .col-sm-21{
  160. width: 87.5%;
  161. }
  162. .col-sm-22{
  163. width:91.66666667%;
  164. }
  165. .col-sm-23{
  166. width: 95.83333333%;
  167. }
  168. .col-sm-24{
  169. width:100%;
  170. }
  171. }
  172. @media screen and (min-width: 992px){
  173. .col-md-0{
  174. width: 0%;
  175. overflow: hidden;
  176. }
  177. .col-md-1{
  178. width: 4.16666667%;
  179. }
  180. .col-md-2{
  181. width: 8.333333333%;
  182. }
  183. .col-md-3{
  184. width: 12.5%;
  185. }
  186. .col-md-4{
  187. width: 16.66666667%;
  188. }
  189. .col-md-5{
  190. width: 20.83333333%;
  191. }
  192. .col-md-6{
  193. width: 25%;
  194. }
  195. .col-md-7{
  196. width: 29.16666667%;
  197. }
  198. .col-md-8{
  199. width: 33.33333333%;
  200. }
  201. .col-md-9{
  202. width: 37.5%;
  203. }
  204. .col-md-10{
  205. width: 41.66666667%;
  206. }
  207. .col-md-11{
  208. width: 45.83333333%;
  209. }
  210. .col-md-12{
  211. width: 50%;
  212. }
  213. .col-md-13{
  214. width: 54.16666667%;
  215. }
  216. .col-md-14{
  217. width: 58.33333333%;
  218. }
  219. .col-md-15{
  220. width: 62.5%;
  221. }
  222. .col-md-16{
  223. width: 66.66666667%;
  224. }
  225. .col-md-17{
  226. width: 70.83333333%;
  227. }
  228. .col-md-18{
  229. width:75%;
  230. }
  231. .col-md-19{
  232. width: 71.16666667%;
  233. }
  234. .col-md-20{
  235. width:83.33333333%;
  236. }
  237. .col-md-21{
  238. width: 87.5%;
  239. }
  240. .col-md-22{
  241. width:91.66666667%;
  242. }
  243. .col-md-23{
  244. width: 95.83333333%;
  245. }
  246. .col-md-24{
  247. width:100%;
  248. }
  249. }
  250. @media screen and (min-width: 1200px){
  251. .col-lg-0{
  252. width: 0%;
  253. overflow: hidden;
  254. }
  255. .col-lg-1{
  256. width: 4.16666667%;
  257. }
  258. .col-lg-2{
  259. width: 8.333333333%;
  260. }
  261. .col-lg-3{
  262. width: 12.5%;
  263. }
  264. .col-lg-4{
  265. width: 16.66666667%;
  266. }
  267. .col-lg-5{
  268. width: 20.83333333%;
  269. }
  270. .col-lg-6{
  271. width: 25%;
  272. }
  273. .col-lg-7{
  274. width: 29.16666667%;
  275. }
  276. .col-lg-8{
  277. width: 33.33333333%;
  278. }
  279. .col-lg-9{
  280. width: 37.5%;
  281. }
  282. .col-lg-10{
  283. width: 41.66666667%;
  284. }
  285. .col-lg-11{
  286. width: 45.83333333%;
  287. }
  288. .col-lg-12{
  289. width: 50%;
  290. }
  291. .col-lg-13{
  292. width: 54.16666667%;
  293. }
  294. .col-lg-14{
  295. width: 58.33333333%;
  296. }
  297. .col-lg-15{
  298. width: 62.5%;
  299. }
  300. .col-lg-16{
  301. width: 66.66666667%;
  302. }
  303. .col-lg-17{
  304. width: 70.83333333%;
  305. }
  306. .col-lg-18{
  307. width:75%;
  308. }
  309. .col-lg-19{
  310. width: 71.16666667%;
  311. }
  312. .col-lg-20{
  313. width:83.33333333%;
  314. }
  315. .col-lg-21{
  316. width: 87.5%;
  317. }
  318. .col-lg-22{
  319. width:91.66666667%;
  320. }
  321. .col-lg-23{
  322. width: 95.83333333%;
  323. }
  324. .col-lg-24{
  325. width:100%;
  326. }
  327. }
  328. @media screen and (min-width: 1366px){
  329. .col-max-0{
  330. width: 0%;
  331. overflow: hidden;
  332. }
  333. .col-max-1{
  334. width: 4.16666667%;
  335. }
  336. .col-max-2{
  337. width: 8.333333333%;
  338. }
  339. .col-max-3{
  340. width: 12.5%;
  341. }
  342. .col-max-4{
  343. width: 16.66666667%;
  344. }
  345. .col-max-5{
  346. width: 20.83333333%;
  347. }
  348. .col-max-6{
  349. width: 25%;
  350. }
  351. .col-max-7{
  352. width: 29.16666667%;
  353. }
  354. .col-max-8{
  355. width: 33.33333333%;
  356. }
  357. .col-max-9{
  358. width: 37.5%;
  359. }
  360. .col-max-10{
  361. width: 41.66666667%;
  362. }
  363. .col-max-11{
  364. width: 45.83333333%;
  365. }
  366. .col-max-12{
  367. width: 50%;
  368. }
  369. .col-max-13{
  370. width: 54.16666667%;
  371. }
  372. .col-max-14{
  373. width: 58.33333333%;
  374. }
  375. .col-max-15{
  376. width: 62.5%;
  377. }
  378. .col-max-16{
  379. width: 66.66666667%;
  380. }
  381. .col-max-17{
  382. width: 70.83333333%;
  383. }
  384. .col-max-18{
  385. width:75%;
  386. }
  387. .col-max-19{
  388. width: 71.16666667%;
  389. }
  390. .col-max-20{
  391. width:83.33333333%;
  392. }
  393. .col-max-21{
  394. width: 87.5%;
  395. }
  396. .col-max-22{
  397. width:91.66666667%;
  398. }
  399. .col-max-23{
  400. width: 95.83333333%;
  401. }
  402. .col-max-24{
  403. width:100%;
  404. }
  405. }