Semua Gaya Konten DetroAMP dan Cara Menggunakannya

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lectus sit amet est placerat in egestas erat. Ac felis donec et odio pellentesque diam volutpat commodo sed. Risus quis varius quam quisque id.


How to use this Table of Content:
<div id="toclist">
 <input checked="checked" id="show" name="group" type="radio" /><input id="hide" name="group" type="radio" /><label class="hide" for="hide">Table of Content</label><label class="show" for="show"></label>
 <div class="content">
  <ol>
   <li><a href="#1">Target #1</a></li>
   <li><a href="#2">Target #2</a>
    <ol>
     <li><a href="#21">Target #2 sub #1</a></li>
     <li><a href="#22">Target #2 sub #2</a></li>
     <li><a href="#23">Target #2 sub #3</a></li>
    </ol>
   </li>
   <li><a href="#3">Target #3</a></li>
  </ol>
 </div>
</div>

<h2>Heading</h2>

<h3>Sub Heading</h3>

<h4>Minor Heading</h4>

<h5>Minor Heading</h5>
<h6>Minor Heading</h6>

Table and Text Styles

ResultHow to use
Bold<b>Bold</b>
Italic<i>Italic</i>
Bold Italic<b><i>Bold Italic</i></b>
Underline<u>Underline</u>
Striketrough<strike>Striketrough</strike>
Mark<mark>Mark</mark>
Code Style<code>Code Style</code>
M3M<sup>3</sup>
H2OH<sub>2</sub>O
Exterlink<a class="exterlink" href="#">Exterlink</a>
Yellow<span class="yellow">Yellow</span>
Blue<span class="blue">Blue</span>
Red<span class="red">Red</span>
Lime<span class="lime">Lime</span>
Green<span class="green">Green</span>
Grey<span class="grey">Grey</span>
Orange<span class="orange">Orange</span>

Syntax Highlighter

<div class='about'>
 <a href='/p/disclaimer.html' title='Disclaimer'>Disclaimer</a>
 <a href='/p/contact.html' title='Contact'>Contact</a>
 <a href='/p/term-of-service.html' title='Term of Services'>TOS</a>
 <a href='/p/privacy-policy.html' title='Privacy Policy'>Privacy</a>
 <a href='/p/about.html' title='About Us'>About</a>
</div>
How to use :
<pre>
 <code>
  Parsed CSS, HTML, Java Script here
 </code>
</pre>

Box and Blockquote

Blockquote

Suspendisse potenti nullam ac tortor vitae purus faucibus ornare suspendisse. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Ac turpis egestas integer eget aliquet nibh praesent. Malesuada fames ac turpis egestas.
<blockquote>
  Text here
</blockquote>

Warning Box

Suspendisse potenti nullam ac tortor vitae purus faucibus ornare suspendisse. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique.
<div class="warning">
  Text here
</div>

Important Box

Suspendisse potenti nullam ac tortor vitae purus faucibus ornare suspendisse. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique.
<div class="important">
  Text here
</div>

Note Box

Suspendisse potenti nullam ac tortor vitae purus faucibus ornare suspendisse. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique.
<div class="note">
  Text here
</div>

Recommended Box

<div class="recommended">
  Text here
</div>

Box Baca Juga

<div class="bacajuga">
  Baca juga: <a href="#link">Text</a>
</div>

Button





How to use :
<a href="#"><button>Normal</button></a>
<a href="#"><button class="download">Download</button></a>
<a href="#"><button class="preview">Preview</button></a>

Ordered Lists (Nested)

  1. item
  2. item
    1. item
    2. item
      1. item
      2. item
    3. item
    4. item
  3. item
How to use :
<div class="nested">
<ol>
  <li>item</li>
  <li>item
    <ol>
      <li>item</li>
      <li>item
        <ol>
          <li>item</li>
          <li>item</li>
        </ol>
      </li>
      <li>item</li>
      <li>item</li>
    </ol>
  </li>
  <li>item</li>
</ol>
</div>

Unordered Lists (Nested)

  • item
  • item
    • item
    • item
      • item
      • item
    • item
    • item
  • item
How to use :
<ul>
  <li>item</li>
  <li>item
    <ul>
      <li>item</li>
      <li>item
        <ul>
          <li>item</li>
          <li>item</li>
        </ul>
      </li>
      <li>item</li>
      <li>item</li>
    </ul>
  </li>
  <li>item</li>
</ul>
Tanggapan:
Open Comment