The popular front-end practical knowledge continuously updated in ......

 

1. Toggle similar in jquery ()

 // if the class name, you get rid of, if not, add 
        div.classList.toggle ( "expand");

2.css3 the columns attribute to achieve waterfall layout, multi-column layout

div
 { 
    Columns : 100px. 3 ; // each column is divided into three 100px, if the number of columns is reduced viewport consequent reduction 
    -webkit-Columns : 100px. 3 ; / * Safari and the Chrome * / 
    -moz-Columns : 100px. 3 ; / * Firefox * / 
}

column-width to the smallest width of the column definition. The default value autorepresents a column width is automatically adjusted according to the number of column-count column.
The maximum number COUNT-column column
column-GAP: the gap between the columns and columns, the default is 16px under ie, other browsers not given clear.

column-rule each vertical column of the gap

column-span: elements across several columns (firefox does not support)

Guess you like

Origin www.cnblogs.com/wxyblog/p/12055936.html