boilerplate typography css framework in CSS

Loading ...
/* --------------------------------------------------------------
Boilerplate typography.css
* Sets up some sensible default typography.
-------------------------------------------------------------- */
/* This is where you set your desired font size. The line-heights
and vertical margins are automatically calculated from this.
The percentage is of 16px (0.75 * 16px = 12px). */
body { font-size: 75%; }
/* Default fonts and colors. */
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea { font-family: "Trebuchet MS", Helvetica, Tahoma, Arial, sans-serif; }
/* Headings
-------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
h1 { font-size: 2.5em; line-height: 1; margin-bottom: 0.5em; padding-left:10px;}
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin: 1em 0em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 0.5em; }
h5 { font-size: 1em; margin-bottom: 1.5em; }
h6 { font-size: 1em; }
/* Text elements
-------------------------------------------------------------- */
p { margin: 0 0 0.5em; line-height:1.7em; } /* changed by Max */
/* p:first-letter { display: block; float: left; margin: 5px 5px 0 0; font-size: 1.4em; } cancelled by Max */
ul, ol { margin: 0 1.5em 1.5em 1.5em; }
ul { list-style-type: circle; }
ol { list-style-type: decimal; }
dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1.5em; }
abbr, acronym { border-bottom: 1px dotted #000; }
address { margin-top: 1.5em; font-style: italic; }
del { color: #000; }
blockquote { padding:1em 1em 1em 1.5em; font-family:baskerville,"palatino linotype",serif; }
blockquote > *:first-child:before { content:"\201C"; font-size:3.5em; margin-left:-.62em; font-family:georgia,serif; padding-right:.2em; color:#aaa; line-height:0; }/* From Tripoli */
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { margin: 1.5em 0; white-space: pre; }
pre, code, tt { font: 1em monospace; line-height: 1.5; }
tt { display: block; margin: 1.5em 0; line-height: 1.5; }
hr { margin-bottom:1.5em; }
/* Tables
-------------------------------------------------------------- */
table { margin-bottom: 1.4em; }
th { border-bottom: 2px solid #ddd; font-weight: bold; }
td { border-bottom: 1px solid #ddd; }
th,td { padding: 4px 10px 4px 10px; }
tfoot { font-style: italic; }
caption { background: #ffc; padding:5px; }
You may want to check :
- simple slide panel
- global css general set of rules
- RMS css forms framework
- Hartija css print framework
- Formy CSS forms framework
One Comment
Genial post and this fill someone in on helped me alot in my college assignement. Say thank you you as your information.