Type Classes

Type classes are the foundation for reusable, modular and semantic CSS to provide the reader what elements, tags and sections are affected.

Syntax

.{type}

.{type}-{name}

.{type}-{context}

Overview

Prefix	Tag	Example
address-	address	.address-content
audio-	audio, object	.audio-content
box-	div	.box-content
break-	hr	.break-content
button-	a, button	.button-content
caption-	caption	.caption-content
code-	code, pre	.code-content
col-	td, th	.col-content
data-	datalist	.data-content
field-	input, select, textarea	.field-content
form-	form	.form-content
frame-	iframe	.frame-content
image-	canvas, img, object, picture, svg	.image-content
item-	dd, dt, li	.item-content
label-	label	.label-content
legend-	legend	.legend-content
link-	a	.link-content
list-	dl, ol, ul	.list-content
modal-	div	.modal-content
overlay-	div	.overlay-content
progress-	progress	.progress-content
quote-	blockquote, citie	.quote-content
set-	fieldset	.set-content
shape-	cicle, path, rect, symbol, use	.shape-content
table-	table	.table-content
row-	tr	.row-content
text-	em, small, span, strong, p	.text-content
title-	h1, h2, h3, h4, h5, h6	.title-content
video-	object, video	.video-content