Common style of compass tables [Sass and compass learning notes]

Demo source address https://github.com/qqqzhch/webfans

Compass tables provide a set of common styles

Table border

Outer-table-borders ($ width, $ color) controls the size and color of the outer border

Inner-table-borders ($ width, $ color) controls the size and color of the border inside.

For example

. Table1 {table {@ include inner-table-borders (1px, #7a98c6); @ include outer-table-borders (2px );}}

. Table2 {table {@ include table-scaffolding ;}}

 

. Table3 {table {$ table-color: #7a98c6; @ include alternating-rows-and-columns ($ table-color, adjust-hue ($ table-color,-120deg ), #222222 );}}