Source Kode Yang sering Digunakan

GS NEWS


Button

Buttonred Buttonorange Buttongreen Buttonblue Buttonpurple Buttonyellow Buttonmint Buttonaqua Buttonpink Buttonwhite Buttongrey Buttondark-grey Button
<a class="button red" href="#">red Button</a>
<a class="button orange" href="#">orange Button</a>
<a class="button green" href="#">green Button</a>
<a class="button blue" href="#">blue Button</a>
<a class="button purple" href="#">purple Button</a>
<a class="button yellow" href="#">yellow Button</a>
<a class="button mint" href="#">mint Button</a>
<a class="button aqua" href="#">aqua Button</a>
<a class="button pink" href="#">pink Button</a>
<a class="button white" href="#">white Button</a>
<a class="button grey" href="#">grey Button</a>
<a class="button dark-grey" href="#">dark-grey Button</a>


Buttonred Buttonorange Buttongreen Buttonblue Buttonpurple Buttonyellow Buttonmint Buttonaqua Buttonpink Buttongrey Buttondark-grey Button
<a class="button transparent" href="#">Button</a>
<a class="button transparent red" href="#">red Button</a>
<a class="button transparent orange" href="#">orange Button</a>
<a class="button transparent green" href="#">green Button</a>
<a class="button transparent blue" href="#">blue Button</a>
<a class="button transparent purple" href="#">purple Button</a>
<a class="button transparent yellow" href="#">yellow Button</a>
<a class="button transparent mint" href="#">mint Button</a>
<a class="button transparent aqua" href="#">aqua Button</a>
<a class="button transparent pink" href="#">pink Button</a>
<a class="button transparent grey" href="#">grey Button</a>
<a class="button transparent dark-grey" href="#">dark-grey Button</a>

Buttonred Buttonorange Buttongreen Buttonblue Buttonpurple Buttonyellow Buttonmint Buttonaqua Buttonpink Buttonwhite Buttongrey Buttondark-grey Button
<a class="button" href="#"><i class="fa fa-bolt"></i>Button</a>
<a class="button red" href="#"><i class="fa fa-bookmark"></i>red Button</a>
<a class="button orange" href="#"><i class="fa fa-cart-arrow-down"></i>orange Button</a>
<a class="button green" href="#"><i class="fa fa-bars"></i>green Button</a>
<a class="button blue" href="#"><i class="fa fa-cloud-download"></i>blue Button</a>
<a class="button purple" href="#"><i class="fa fa-fighter-jet"></i>purple Button</a>
<a class="button yellow" href="#"><i class="fa fa-external-link"></i>yellow Button</a>
<a class="button mint" href="#"><i class="fa fa-gavel"></i>mint Button</a>
<a class="button aqua" href="#"><i class="fa fa-life-ring"></i>aqua Button</a>
<a class="button pink" href="#"><i class="fa fa-magic"></i>pink Button</a>
<a class="button white" href="#"><i class="fa fa-location-arrow"></i>white Button</a>
<a class="button grey" href="#"><i class="fa fa-leaf"></i>grey Button</a>
<a class="button dark-grey" href="#"><i class="fa fa-meh-o"></i>dark-grey Button</a>



Success Message

success message : You successfully read this important message.
<div class="alert-message success"><i class="fa fa-check-circle"></i> success message : You successfully read this important message.  


Alert Message

Alert message : This alert needs your attention.
<div class="alert-message alert"><i class="fa fa-info-circle"></i> Alert message : This alert needs your attention.     <br /></div>


Warning Message

Warning message : Warning! Best check yo self.
<div style="background-color: #2b3b44; border-radius: 0px; border: 2px dotted rgb(255, 255, 255); height: 100px; overflow: auto; padding: 10px; text-align: left; width: auto;"></div>


Error Message

Error message : Oh snap! Change a few things up.

<div class="alert-message error"><i class="fa fa-exclamation-circle"></i> Error message : Oh snap! Change a few things up.     <br /></div><br />  


Table 2 Columns

Head 1 Head 2
Example 1 Example 2
Example 6 Example 7


<table class="charon-table">  <tbody> 
  <tr>      <th>Head 1</th>      <th>Head 2</th>    </tr>    <tr>     
<td>Example 1</td>      <td>Example 2</td>    </tr>    <tr>      <td>Example 6</td>      <td>Example 7</td>


Table 3 Columns

Head 1 Head 2 Head 3
Example 1 Example 2 Example 3
Example 6 Example 7 Example 8

<table class="charon-table"> 
<tbody>    <tr>      <th>Head 1</th>      <th>Head 2</th>      <th>Head 3</th>    </tr>    <tr>      <td>Example 1</td>      <td>Example 2</td>      <td>Example 3</td>    </tr>    <tr>      <td>Example 6</td>      <td>Example 7</td>      <td>Example 8</td>    </tr>  </tbody> </table><br />


Table 4 Columns

Head 1 Head 2 Head 3 Head 4
Example 1 Example 2 Example 3 Example 4
Example 6 Example 7 Example 8 Example 9

<table class="charon-table"> 
 <tbody>    <tr>      <th>Head 1</th>      <th>Head 2</th>      <th>Head 3</th>      <th>Head 4</th>    </tr>    <tr>     
 <td>Example 1</td>      <td>Example 2</td>      <td>Example 3</td>      <td>Example 4</td>    </tr>    <tr>      <td>Example 6</td>      <td>Example 7</td>      <td>Example 8</td>      <td>Example 9</td>    </tr>  </tbody> </table><br />


Table 5 Columns

Head 1 Head 2 Head 3 Head 4 Head 5
Example 1 Example 2 Example 3 Example 4 Example 5
Example 6 Example 7 Example 8 Example 9 Example 10

<table class="charon-table"> 
<tbody>    <tr>      <th>Head 1</th>      <th>Head 2</th>      <th>Head 3</th>      <th>Head 4</th>      <th>Head 5</th>    </tr>   
 <tr>      <td>Example 1</td>      <td>Example 2</td>      <td>Example 3</td>      <td>Example 4</td>      <td>Example 5</td>    </tr>    <tr>      <td>Example 6</td>      <td>Example 7</td>      <td>Example 8</td>      <td>Example 9</td>      <td>Example 10</td>    </tr>  </tbody> </table><br /><br />
Tags
Komentar