Style Properties

Vine

This lesson:  Overview | Properties 
Other lessons:  Style Syntax | Order of Precedence | Style Properties | Other Style Information
Intro. to Styles | Inline Styles | Embedded Style Sheets | Linked Style Sheets

Overview

These are some of the more common properties that may be used.  Consult a reference for a information about other properties.

Properties

Font Properties

Property Description Values Example

font-family

Sets a specific font or font family

Font name
Font family name

{ font-family: arial }

{ font-family: serif }

font-size

Sets the font size in absolute or relative values

absolute:
  pt - points
  in - inches
  cm - centimeters
  px - pixels
  em - em space

Note: The em measurement is  based upon the widest character of a font.
 
relative size:
  %
  smaller
  larger

{ font-size: 20pt }

{ font-size: 10% }

font-style

Sets font as italic or normal

normal
italic

{ font-style: italic }

font-weight

Sets font as heavier or lighter

extra-light
light
demi-light
medium
demi-bold
bold
extra-bold

{ font-weight: bold }

Text Properties

background-color

Sets background color for text

Color name or RGB (Hex) value

{ background-color: yellow }

background-image

Sets background image for text

URL

{ background-image: url(flag.jpg) }

color

Sets color of text

Color name or RGB (Hex) value

{ color: navy }

{ color: #000080 }

margin-left

margin-right

margin-top

margin-bottom

Sets left margin

Sets right margin

Sets top margin

Sets bottom margin

pt - points
in - inches
cm - centimeters
px - pixels
em - em space
% - percentage

{ margin-left: 50pt }

{ margin-right: 90px }

{ margin-top: 2in }

text-align

Sets text alignment

left
center
right

{ text-align: right }

text-indent

Sets indent for first line in paragraph

pt - points
in - inches
cm - centimeters
px - pixels
em - em space
% - percentage

{ text-indent: .5in }

{ text-indent: 25pt }

Penn State Behrend Home | Computer Center Home

This page is maintained by Carolyn Dudas
Updated May 21, 2002