Was kann das Combosa Blog Template
Zugegeben, diesen Eintrag haben wir für uns selbst geschrieben, um die Nachfolgenden Code Zeilen zu kopieren und an den gewünschten Stellen einzufügen. Es geht um CSS Darstellungen für Tabellen, Code, Blockquode, Buttons und CSS Boxen. Wir lieben CSS und möchten natürlich auf unseren Block die schönsten Darstellungsmöglichkeiten aufzeigen.
HTML Shortcodes
Fangen wir an mit Tabellen:
Feature | Easy | Business | Premium |
---|---|---|---|
jetzt bestellen
|
jetzt bestellen | jetzt bestellen | |
Webspace | 100 MB | 500 MB | 1000 MB |
24H Support | |||
Free Lifetime Update | |||
Email Address | |||
Search Engine Optimisation | |||
24H Support | |||
Free Lifetime Update | |||
Email Address | |||
Search Engine Optimisation | |||
Email Address | |||
Price | 3.99 €
|
6.99 €
|
10.00 €
|
Der Code für Tabellen ist dann:
<table> <thead> <tr> <th scope="col">Feature</th> <th scope="col">Easy</th> <th scope="col">Business</th> <th scope="col">Premium</th> </tr> </thead> <tfoot> <tr> <td>nbsp;</td> <td><strong><a href="#">jetzt bestellen<br /> </a></strong></td> <td><a href="#"></a><strong><a href="#">jetzt bestellen</a></strong></td> <td><a href="#"></a><strong><a href="#">jetzt bestellen</a></strong></td> </tr> </tfoot> <tbody> <tr class="odd"> <td class="cellfeat">Webspace</td> <td>100 MB</td> <td>500 MB</td> <td>1000 MB</td> </tr> <tr> <td class="cellfeat">24H Support</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr class="odd"> <td class="cellfeat">Free Lifetime Update</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr> <td class="cellfeat">Email Address</td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr class="odd"> <td class="cellfeat">Search Engine Optimisation</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr> <td class="cellfeat">24H Support</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr class="odd"> <td class="cellfeat">Free Lifetime Update</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr> <td class="cellfeat">Email Address</td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr class="odd"> <td class="cellfeat">Search Engine Optimisation</td> <td><img alt="No" src="icon_20.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr> <td class="cellfeat">Email Address</td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> <td><img alt="Yes" src="icon_9.png" /></td> </tr> <tr class="odd"> <td class="cellfeat">Price</td> <td><strong>3.99 euro;<br /> </strong></td> <td><strong>6.99 euro;<br /> </strong></td> <td><strong>10.00 euro;<br /> </strong></td> </tr> </tbody> </table>
Der Code für Meldungen:
<div class="pen">Für einen Code zum Beispiel.!</div> <div class="noti_warning">Eine Warnung.!</div> <div class="noti_note">Feld für eine Note..</div> <div class="noti_info">Hier eine Information..</div> <div class="noti_success">Ja Sie haben es geschafft.!</div>
Blockquote
Maecenas metus. Vivamus diam purus, cursus a, commodo non, facilisis vitae, nulla. Aenean dictum lacinia tortor. Nunc iaculis, nibh non iaculis aliquam, orci felis euismod neque, sed ornare massa mauris sed velit.
Mehr informationen: zum Thema
<blockquote> <p>Maecenas metus. Vivamus diam purus, cursus a, commodo non, facilisis vitae, nulla. Aenean dictum lacinia tortor. Nunc iaculis, nibh non iaculis aliquam, orci felis euismod neque, sed ornare massa mauris sed velit.</p> <cite>Mehr informationen: <a href="#"> zum Thema</a></cite> </blockquote>
Address:
Address Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed<address> Address Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed </address>
Eine ul Liste
- Das ist eine ul Liste
- Das ist eine Liste
- Das ist eine Liste
- Das ist eine Liste
- Das ist eine Liste
Eine ol Liste
- Das ist eine ol Liste
- Das ist eine Liste
- Das ist eine Liste
- Das ist eine Liste
- Das ist eine Liste
Ãœberschriften
This is a H1 heading
This is a H2 heading
This is a H3 heading
This is a H4 heading
This is a H5 heading
This is a H6 heading
Col 274
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
Col 274-last
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.