0%
Uix Kit Demo

Common Helper Classes

Helper classes can help remove repetition by creating a set of abstract classes that can be used over and over on HTML elements.

Typography Color Align Wide and Full Classes For Elements
.uix-typo--h1
.uix-typo--h2
.uix-typo--h3
.uix-typo--h4
.uix-typo--h5
.uix-typo--h6
.uix-typo--style-normal
.uix-typo--style-uppercase
.uix-typo--style-bold
.uix-typo--style-italic
.uix-typo--style-noitalic
.uix-typo--style-underline
.uix-typo--style-tiny
.uix-typo--dropcap
.uix-typo--vertical
.uix-typo--vertical-characters-line)
.uix-typo--color-primary
.uix-typo--color-highlight
.uix-typo--color-sub
.uix-typo--color-white
.uix-alignfull
Spacing Content Block Clear Element
.uix-spacing--s
.uix-spacing--m
.uix-spacing--l
.uix-spacing--no-top
.uix-spacing--no-bottom
.uix-spacing--googlemap
.uix-spacing--no
.uix-relative
.uix-relative--inline
.uix-relative--inline-clip
.uix-clearfix
Shadow Smooth Transition Element Floating
.uix-outer-shadow--regular
.uix-outer-shadow--thick
.uix-outer-shadow--light
.uix-outer-shadow--highlight
.uix-none-shadow
.uix-trans .uix-f-l
.uix-f-r
Element Alignment Truncate String with Ellipsis Vertically or Horizontally Aligned Blocks
.uix-t-r
.uix-t-l
.uix-t-c
.uix-mobile-tc
.uix-mobile-tl
.uix-mobile-tr
.uix-t-ellipsis .uix-v-align--absolute
.uix-v-align--relative
.uix-v-align--table
Specifies Whether To Clip Content Specifies a Default Height (unit: vh) Hidden The Element on Mobile Device
.uix-hidden-scrollbar-x
.uix-hidden-scrollbar
.uix-height--10
.uix-height--20
.uix-height--30
.uix-height--40
.uix-height--50
.uix-height--60
.uix-height--70
.uix-height--80
.uix-height--90
.uix-height--100
.uix-mobile-el
.is-mobile-hide(The mobile side is always hidden)
Tip Bubble Image Hover Overlay Effects Position
.uix-bubble .uix-filter-hover--color .uix-dir--top
.uix-dir--bottom
.uix-dir--left
.uix-dir--right
.uix-dir--top-left
.uix-dir--top-right
.uix-dir--bottom-left
.uix-dir--bottom-right
Element Hidden Style Border Radius
.uix-el--transparent
.uix-el--zoom
.uix-el--skew
.uix-border--rounded
.uix-border--circle
.uix-border--circle.uix-border--circle-img
.uix-border--circle.uix-border--circle-only-img