Clases auxiliares para mostrar/ocultar elementos haciéndolos coincidir con los puntos de corte.
Las clases responsive helper muestran u ocultan elementos en los puntos de corte especificados. En el caso de las clases .hidden-xs .hidden-sm .hidden-md .hidden-lg .hidden-xl es sencillo, ocultaran el elemento que las tenga en la resolución especificada. En cuanto al mostrar, tenemos las clases .visible-xs .visible-sm .visible-md .visible-lg .visible-xl que tratan los elementos que las tienen como de bloque display: block; y las tablas, filas y celdas de la tabla como se corresponde display: table|table-row|table-cell;. También tenemos el mismo comportamiento por resoluciones pero para cuando queremos mostrar elementos en sus 3 variantes block|inline-block|inline, con clases como .visible-xs-block, .visible-xs-inline-block y .visible-xs-inline, entre otras.
<span class="visible-xs"></span>
<span class="visible-sm"></span>
<span class="visible-md"></span>
<span class="visible-lg"></span>
<span class="visible-xl"></span>
<span class="visible-xs-block"></span>
<span class="visible-sm-block"></span>
<span class="visible-md-block"></span>
<span class="visible-lg-block"></span>
<span class="visible-xl-block"></span>
<span class="visible-xs-inline-block"></span>
<span class="visible-sm-inline-block"></span>
<span class="visible-md-inline-block"></span>
<span class="visible-lg-inline-block"></span>
<span class="visible-xl-inline-block"></span>
<span class="visible-xs-inline"></span>
<span class="visible-sm-inline"></span>
<span class="visible-md-inline"></span>
<span class="visible-lg-inline"></span>
<span class="visible-xl-inline"></span>
<span class="hidden-xs"></span>
<span class="hidden-sm"></span>
<span class="hidden-md"></span>
<span class="hidden-lg"></span>
<span class="hidden-xl"></span>