CSS

Table of Contents

Introduction

Basics

Options for defining style information

Inline style sheet

<p style="background-color: grey;">

Internal style sheet

<head>
    <style type="text/css">#element {background-color:grey;}</style>
</head>

External style sheet

<head>
    <link href="filename.css" rel="stylesheet" type="text/css" />
</head>

Selectors

CSS selectors are necessary to link the formatting information with the HTML elements

Values

Absolute numeric values

Value Description
pt point (1pt=0.35mm)
pc pica
in inch (1in=2.54cm)
mm millimeter
cm centimeter

Relative numeric values

Value Description
px Pixel (relative to the display)
em The font size of the respective element
ex The size of the character "x" of the current font
% Percentage; relative to other values

Layout

display

The "display" property determines the how an element behaves in respect of the layout. For example, an element can behave like a block or list item.

position

Float

With the float option, an element can be removed from the normal text flow. It will be placed on the left or right side of the window. All other elements float around it. Clear is being used to stop the floating.

overflow

The overflow property can be used to determine the display behavior for content which doesn't fit into its parent element.

Frameworks

Miscellaneous

GitHubImpressum