Sensation Energy

Tutorials


Boxes

Example


Boxes allows us to anchor some text or field or label. Inside we can change borders, text, color, ...

It is used by copying the code below, and then pastes it into your application or website. Before that, you can use our CSS and JS to make certain functionalities work for you. These are the addressees:

     
     <link rel="stylesheet" href="www.sensationenergy.com/se_css/se.css>
     <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
     <script  src="www.sensationenergy.com/js_css/se.js"></script>
     
     

Example 1


Boxes Default
Boxes 1
Boxes 2
Boxes 3
Boxes 4
Boxes 5
Boxes 6
Boxes 7
Boxes 8

Example 2

Boxes Info
Boxes Alert
Boxes Warning
Boxes Error
Boxes Success
Boxes Other

Example 1

 
<div class="boxes">Boxes Default</div>
<div class="boxes b-y">Boxes 1</div>
<div class="boxes b-r">Boxes 2</div>
<div class="boxes b-b">Boxes 3</div>
<div class="boxes g-r">Boxes 4</div>
<div class="boxes g-g">Boxes 5</div>
<div class="boxes w-r">Boxes 6</div>
<div class="boxes w-g">Boxes 7</div>
<div class="boxes g-y">Boxes 8</div>

Example 2

 
<div class="boxes">Boxes Default</div>
<div class="boxes b-y">Boxes 1</div>
<div class="boxes b-r">Boxes 2</div>
<div class="boxes b-b">Boxes 3</div>
<div class="boxes g-r">Boxes 4</div>
<div class="boxes g-g">Boxes 5</div>
<div class="boxes w-r">Boxes 6</div>
<div class="boxes w-g">Boxes 7</div>
<div class="boxes g-y">Boxes 8</div>