Text Semantics

em strong i b abbr cite code del ins dfn mark sup sub

Inline text HTML elements are used within other elements. They include: em and strong for semantic emphasis, i and b for presentational formatting, abbr abbreviations, cite citations, code example, strikethrough, ins for visibly deleted and inserted content, dfn definitions, mark for highlighted passages, Inline quotes. Keyboard keys such as press ⌘ Cmd + ⇧ Shift + 3 to take a screen shot.

Sup and sub are not used as these result in poor approximations of superscript and subscript text.



In runnning text most inititalisms should be set in small caps. To do this add the class .initialism to render text with small caps.

Most abbreviations are set in small caps such as BBC, HTML, CSS

php, UK

In headings omit the class.

Horizontal Rule

Pre-formatted text

! " # $ % & ’ ( ) * + , - . /
0 1 2 3 4 5 6 7 8 9 : ; < = > ?
@ 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 Bootstrap class for microcopy like a tag. The badge is set in the book weight and Whitney and does not inherit from it’s parent element. Padding is set tight and the same amount X and Y.