Headings
H1.Lorem ipsum dolor sit amet
Headings
H1.Lorem ipsum dolor sit amet
>

Venerdì, 04 Novembre 2011 14:33

Typography

Scritto da 
Vota questo articolo
(0 Voti)

Headings

H1.Lorem ipsum dolor sit amet

H2.Lorem ipsum dolor sit amet

H3.Lorem ipsum dolor sit amet

H4.Lorem ipsum dolor sit amet

H5.Lorem ipsum dolor sit amet
H6.Lorem ipsum dolor sit amet

Emphasis classes

Cum sociispenatibus parturient, your Muted Highlight text goes here... nascetur ridiculus. Cum sociispenatibus parturient, your Primary Highlight text goes here... nascetur ridiculus. Cum sociispenatibus parturient, your Success Highlight text goes here... nascetur ridiculus. Cum sociispenatibus parturient, your Warning Highlight text goes here... nascetur ridiculus. Cum sociispenatibus parturient, your Danger Highlight text goes here... nascetur ridiculus.

Blockquotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Someone famous in Source Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Someone famous in Source Title

Lists

  • Lorem ipsum dolor sit amet
  • Nulla volutpat aliquam velit
  • Lorem ipsum dolor sit
  • Nulla volutpat aliquam
  • Faucibus porta lacus vel
  • Aenean sit amet erat nunc
  1. Lorem ipsum dolor sit amet
  2. Nulla volutpat aliquam velit
  3. Lorem ipsum dolor sit
  4. Nulla volutpat aliquam
  5. Faucibus porta lacus vel
  6. Aenean sit amet erat nunc
  • Lorem ipsum dolor sit amet
  • Nulla volutpat aliquam velit
  • Lorem ipsum dolor sit
  • Faucibus porta lacus vel
  • Aenean sit amet erat nunc
  • Lorem ipsum dolor sit amet
  • Nulla volutpat aliquam velit
  • Lorem ipsum dolor sit
  • Nulla volutpat aliquam
  • Faucibus porta lacus vel
  • Aenean sit amet erat nunc

Tables

Basic example - Optional classes (Default - Striped - Bordered)

Column 1 Column 2 Column 3 Column 4
Item #1 Description Subtotal: $1.00
Item #2 Description Discount: $2.00
Item #3 Description Shipping: $3.00
Item #4 Description Tax: $4.00
All Items Description Your Total: $10.00
Column 1 Column 2 Column 3 Column 4
Item #1 Description Subtotal: $1.00
Item #2 Description Discount: $2.00
Item #3 Description Shipping: $3.00
Item #4 Description Tax: $4.00
All Items Description Your Total: $10.00
Column 1 Column 2 Column 3 Column 4
Item #1 Description Subtotal: $1.00
Item #2 Description Discount: $2.00
Item #3 Description Shipping: $3.00
Item #4 Description Tax: $4.00
All Items Description Your Total: $10.00

Links & Buttons

Link

Lorem ipsum dolor sit amet Consectetur adipiscing elit Integer molestie lorem at massa Facilisis in pretium nisl aliquet.

Button Options

Button Sizes

Thumbnails

Default Thumbnail Image

image title Etiam quis elit ut odio rutrum hendrerit sodales vitae orci. Morbi viverra porta scelerisque. Vestibulum consequat, leo vulputate sollicitudin bibendum, arcu ipsum sagittis lacus, et vehicula eros ligula ac nulla. Mauris eu sem dui. Nullam felis nulla, scelerisque nec arcu non, volutpat placerat dolor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean condimentum, felis vehicula faucibus pretium, augue libero cursus odio, eu venenatis est arcu et est. Vestibulum ultricies libero magna, eget feugiat tellus pellentesque sed.

Default Rounded Image

image title Etiam quis elit ut odio rutrum hendrerit sodales vitae orci. Morbi viverra porta scelerisque. Vestibulum consequat, leo vulputate sollicitudin bibendum, arcu ipsum sagittis lacus, et vehicula eros ligula ac nulla. Mauris eu sem dui. Nullam felis nulla, scelerisque nec arcu non, volutpat placerat dolor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean condimentum, felis vehicula faucibus pretium, augue libero cursus odio, eu venenatis est arcu et est. Vestibulum ultricies libero magna, eget feugiat tellus pellentesque sed.

Default Circle Image

image title Etiam quis elit ut odio rutrum hendrerit sodales vitae orci. Morbi viverra porta scelerisque. Vestibulum consequat, leo vulputate sollicitudin bibendum, arcu ipsum sagittis lacus, et vehicula eros ligula ac nulla. Mauris eu sem dui. Nullam felis nulla, scelerisque nec arcu non, volutpat placerat dolor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean condimentum, felis vehicula faucibus pretium, augue libero cursus odio, eu venenatis est arcu et est. Vestibulum ultricies libero magna, eget feugiat tellus pellentesque sed.

Tabs

Pras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
Ligula ac nulla. Mauris eu sem dui. Nullam felis nulla, scelerisque nec arcu non, volutpat placerat dolor
Felis nulla, scelerisque nec arcu nonla, scelerisque nec arcu non, volutpat placerat dolorPras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus. Ollicitudin commodo. Fusce condimentum nunc ac nisi vulputate fringilla fringilla. Donec lacinia congue felis in faucibus.

Tooltips

Dras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante commodo sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus faucibus tiao. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

Alert Messages

Default Alert Messages

Well Done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Best check yo self, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Dismissable Alert Messages

Well Done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Best check yo self, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Links in Alert Messages

Well Done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Best check yo self, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Drop Caps

Dras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
Aras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

Social Icons

Social Sharing

Awesome Icons

How to use the Typography

Gap
[gap height="30"]

Headings
[title size="1,2,3,4,5,6"]Your Heading goes here..[/title]

Emphasis classes
First text [highlight type="muted, primary, success, warning, danger"]your highlight text goes here...[/highlight] end text.

Blockquotes
<blockquote>Your text goes here...</blockquote>

Default List
[list type="unordered, ordered, unstyled"]
<ul>
   <li>Lorem ipsum dolor sit amet</li>
   <li>Nulla volutpat aliquam velit</li>
   <li>Aenean sit amet erat nunc</li>
</ul>
[/list]

List with icons
[list type="unordered, ordered, unstyled"]
<ul>
   <li><i class="fa fa-camera-retro"></i>Lorem ipsum dolor sit amet</li>
   <li><i class="fa fa-cog"></i>Nulla volutpat aliquam velit</li>
   <li><i class="fa fa-check"></i>Aenean sit amet erat nunc</li>
</ul>
[/list]

Button Options
[button type="button" color_type="primary"]Primary[/button]
[button type="button" color_type="success"]Success[/button]
[button type="button" color_type="info"]Info[/button]
[button type="button" color_type="warning"]Warning[/button]
[button type="button" color_type="danger"]Danger[/button]

Button Sizes
[button type="button" color_type="primary" size="large"]Large Button[/button]
[button type="button" color_type="primary"]Default Button[/button]
[button type="button" color_type="primary" size="small"]Small Button[/button]
[button type="button" color_type="primary" size="mini"]Extra small button[/button]

Thumbnails
[imageframe src="/your_image_path_goes_heree" type="thumbnail, rounded, circle" alt="your image title" align="left, right"]

Tabs
[tabs tab1="Home" tab2="Profile" tab3="Info" active="tab1"]
   [tab id=1 active="yes"]Your text goes here...[/tab]
   [tab id=2 active="no"]Your text goes here...[/tab]
   [tab id=3 active="no"]Your text goes here...[/tab]
[/tabs]

Tooltips
Start text [tooltip title="sample_text" text="Your tooltip message"] end text.

Alert Messages
[alert type="success" dismiss="yes, no"]Well Done! You successfully read this important alert message.[/alert]
[alert type="info" dismiss="yes, no"]Heads up! This alert needs your attention, but it's not super important.[/alert] 
[alert type="warning" dismiss="yes, no"]Warning! Best check yo self, you're not looking too good.[/alert] 
[alert type="danger" dismiss="yes, no"]Oh snap! Change a few things up and try submitting again.[/alert]

Drop Caps
[dropcap type="1"]A[/dropcap]your text goes here.
[dropcap type="2"]B[/dropcap]your text goes here.

Social Icons
[social_icons] 
   [social_icon social="facebook" link="#"] 
   [social_icon social="flickr" link="#] 
   [social_icon social="rss" link="#"] 
   [social_icon social="twitter" link="#"] 
   [social_icon social="vimeo" link="#"] 
   [social_icon social="youtube" link="#"] 
   [social_icon social="pinterest" link="#"] 
   [social_icon social="tumblr" link="#"] 
   [social_icon social="google" link="#"] 
   [social_icon social="dribbble" link="#"]
   [social_icon social="digg" link="#"] 
   [social_icon social="linkedin" link="#"]
   [social_icon social="blogger" link="#"] 
   [social_icon social="skype" link="#"] 
   [social_icon social="forrst" link="#"] 
   [social_icon social="delicious" link="#"] 
   [social_icon social="devianart" link="#"] 
   [social_icon social="yahoo" link="#"] 
   [social_icon social="picasa" link="#"] 
   [social_icon social="email" link="#"] 
   [social_icon social="google" link="#"] 
[/social_icons]

Social Sharing
[social_icons]
   [sharing_box title="Sample Title" link="http://www.google.com" description="Sample description..."]
[/social_icons]

Awesome Icons
[fonticon icon="e.g. fa-adjust, fa-heart" size="e.g. fa-lg, fa-2x, fa-3x, fa-4x, fa-5x" spin="e.g. yes or no" style="" class=""]
[fonticon icon="fa-adjust" size="fa-2x"]
[fonticon icon="fa-cog" size="fa-2x"]
[fonticon icon="fa-check-circle" size="fa-2x"]
[fonticon icon="fa-calendar-o" size="fa-2x"]
[fonticon icon="fa-bell" size="fa-2x"]

more 350+ awesome icons...
Letto 110444 volte Ultima modifica il Giovedì, 21 Febbraio 2013 17:15
Devi effettuare il login per inviare commenti

In collaborazione con

Sponsor

Social

Contatti 

Tarta Club Italia
Via della Repubblica, 39a

47042 Cesenatico (FC)

Partita IVA: 03515480402 - C.F. 90049330401

 

TartaClubItalia

Scrivi al TartaClubItalia, mandaci una mail a infotartaclubitalia@gmail.com.

Scrivi al Webmaster per problemi inerenti al sito.

DMCA.com Protection Status

Chi è online 

Abbiamo 127 visitatori e nessun utente online

Statistiche visite 

Oggi3492
Ieri5766
Questa settimana26893
Questo mese72449
Da sempre14486221

Powered by CoalaWeb
#5e5f72 #66fe00 #77b5b3 #dc1469 #232021 #a55778