This Reference Sheet was created to emphasize the many options available within CSS, particularly for Typography.
So, what are you waiting for, get creative with your headlines!
The page is split into three: CSS Typography Property Table, Web Safe Fonts Table and CSS Typography Value Conversion Table.
Hope this helps.
You can download this Reference Sheet in the following formats: PNG or PDF.
CSS Typography Property Table
| CSS Property | Value | Value Options |
| font | font-style | inhertit normal italic oblique |
| font-variant | inhertit normal small caps | |
| font-weight | 100,200,300,400,500,600,700,800,900 (thin to thick characters) bold, bolder lighter, normal | |
| font-size | View px/em/%/keyword table. | |
| font-family | View Web Safe Font Table | |
| font-size-adjust | inherit none | |
| font-stretch | ultra-condensed extra-condensed condensed semi-condensed semi-expanded expanded extra-expanded ultra-expanded | |
| text | text-align | left right center inherit justify |
| text-decoration | blink inherit line-through none overline underline | |
| text-indent | inherit | |
| text-shadow | select color none inherit | |
| text-transform | none uppercase lowercase inherit capitalize | |
| letter-spacing | inherit normal +(1px,2px,3px…) -(1px,2px,3px…) | |
| direction | ltr (left) rtr (right) | |
| line-height | normal number length % | |
| white-space | normal pre nowrap | |
| word-spacing | normal length |
Web Safe Fonts Table
| font-family: Arial, Arial, Helvetica, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Arial Black, Arial Black, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z |
| font-family: Comic Sans MS, Comic Sans MS, cursive |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Courier New, Courier New, Courier6, monospace |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Georgia, serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Impact, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Lucida Console, monospace |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Lucida Sans Unicode, Lucida Grande, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Tahoma, Geneva, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Times New Roman, Times, serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Trebuchet MS, Helvetica, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: Verdana, Verdana, Geneva, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: MS Sans Serif, Geneva, sans-serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| font-family: MS Serif, New York, serif |
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
CSS Typography Value Conversion Table
| Keyword | Pixel (px) | Points (pt) | Percentage (%) | EMs |
| xx-small | 9px | 7pt | 55% | 0.55em |
| x-small | 10px | 7.5pt | 62.5% | 0.625em |
| n/a | 11px | 8pt | 70% | 0.7em |
| n/a | 12px | 9pt | 75% | 0.7.5em |
| small | 13px | 10pt | 80% | 0.8em |
| n/a | 14px | 10.5pt | 87.5% | 0.875em |
| n/a | 15px | 11pt | 95% | 0.95em |
| medium | 16px | 12pt | 100% | 1em |
| n/a | 17px | 13pt | 105% | 1.05em |
| n/a | 18px | 13.5pt | 112.5% | 1.125em |
| large | 19px | 14pt | 120% | 1.2em |
| n/a | 20px | 14.5pt | 125% | 1.25em |
| x-large | 24px | 18pt | 150% | 1.5em |
| xx-large | 42px | 32pt | 255% | 2.55em |
0 yorum:
Yorum Gönder