1

- Lineheight

Text sam­ple – CSS font-size (px) with 1.4em line-height


Lorem ipsum dolor sit amet, con­secte­tur adip­isic­ing elit, sed do eius­mod tem­por inci­didunt ut labore et dolore magna ali­qua. Ut enim ad minim veniam, quis nos­trud exerci­ta­tion ullamco laboris nisi ut aliquip ex ea com­modo con­se­quat. Duis aute irure dolor in rep­re­hen­derit in volup­tate velit esse cil­lum dolore eu fugiat nulla pariatur. Excep­teur sint occae­cat cup­i­datat non proident, sunt in culpa qui offi­cia deserunt mol­lit anim id est labo­rum.
18px — 1.5em line-height

Lorem ipsum dolor sit amet, con­secte­tur adip­isic­ing elit, sed do eius­mod tem­por inci­didunt ut labore et dolore magna ali­qua. Ut enim ad minim veniam, quis nos­trud exerci­ta­tion ullamco laboris nisi ut aliquip ex ea com­modo con­se­quat. Duis aute irure dolor in rep­re­hen­derit in volup­tate velit esse cil­lum dolore eu fugiat nulla pariatur. Excep­teur sint occae­cat cup­i­datat non proident, sunt in culpa qui offi­cia deserunt mol­lit anim id est labo­rum.
18px — 5.em line-height

16px — 1.4em line-height Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the progressive…

14px - Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of…

12px - Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of an able mind. For, let a man be as able & original…

10px - Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of an able mind. For, let a man be as able & orig­i­nal as he may, he can’t afford to dis­card knowl­edge of what…

Cour­tesy of Type­kit — Full Font Spec­i­men

2

- Links

Yes

Color Change

Under­line

Bor­der Bot­tom

No

Font Changes

Text Trans­form

3

- Letter-spacing

CSS Letter-spacing 0em with 1.4em line-height

Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of an able mind. For, let…

CSS Letter-spacing 0.05em with 1.4em line-height

Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of an able mind. For, let…

CSS Letter-spacing 0.1em with 1.4em line-height

Is not the best kind of orig­i­nal­ity that which comes after a sound appren­tice­ship? That which shall prove to be the blend­ing of a firm con­cep­tion of, “use­ful prece­dent” and the pro­gres­sive ten­den­cies of an able mind. For, let…
4

- The Drop Cap

We used the Drop Caps plu­gin for this spec­i­men but we added our own CSS to the style.css child sheet. By doing this we get a lot more free­dom with the drop caps. We used the “p + p” CSS fea­ture that will indent every para­graph fol­low­ing the first para­graph. All CSS is listed below.

We used the Drop Caps plu­gin for this spec­i­men but we added our own CSS to the style.css child sheet. By doing this we get a lot more free­dom with the drop caps. We used the “p + p” CSS fea­ture that will indent every para­graph fol­low­ing the first para­graph. All CSS is listed below.

We used the Drop Caps plu­gin for this spec­i­men but we added our own CSS to the style.css child sheet. By doing this we get a lot more free­dom with the drop caps. We used the “p + p” CSS fea­ture that will indent every para­graph fol­low­ing the first para­graph. All CSS is listed below.

We used the Drop Caps plu­gin for this spec­i­men but we added our own CSS to the style.css child sheet. By doing this we get a lot more free­dom with the drop caps. We used the “p + p” CSS fea­ture that will indent every para­graph fol­low­ing the first para­graph. All CSS is listed below.


Plu­gin Used — Drop Caps
CSS Used -

span.cap {
     font-family: "league-gothic-1","league-gothic-2", helvetica, serif;
     color: #4AB4C4 ;
     text-shadow: -1px 1px #F4F4F4, -1px 1px #F3F3F3, -2px 2px #F2F2F2, -3px 3px #BCBCBC, -4px 4px #BCBCBC;
     float:left;
     line-height:0.9em;
     padding-right:0.1em;
     margin-bottom:-0.2em;
     font-size:320%;
}

p.first-child {
     font-weight:normal;
}

span.cap span {
     height:0;
     right:0.06em;
     top:-1.06em;
}

.drop p + p {
     text-indent: 1.5em;
     margin-top: 0
}