Supported CSS Styles: Difference between revisions

From RPTools Wiki
Jump to navigation Jump to search
(New page: MapTool supports a subset of the CSS level 1 specification. These styles can be used in-line, and also as external styles within dialogs and frames. This is not meant to be an exhaustive r...)
 
No edit summary
Line 1: Line 1:
MapTool supports a subset of the CSS level 1 specification. These styles can be used in-line, and also as external styles within dialogs and frames. This is not meant to be an exhaustive reference, nor an introduction to CSS, this page is only a collection of which properties are supported and to what extent.
MapTool supports a subset of the CSS level 1 specification. These styles can be used in-line, and also as external styles within dialogs and frames. This is not meant to be an exhaustive reference, nor an introduction to CSS, this page is only a collection of which properties are supported and to what extent.


==Font Properties==
=Font Properties=
===font===
==font==
{|
{|
|'''Value:'''||font-style, font-weight, font-size, font-family
|'''Value:'''||font-style, font-weight, font-size, font-family
Line 20: Line 20:
|}
|}
   
   
----
==font-family==
===font-family===
{|
{|
|'''Value:'''||''family-name'', ''generic-name''
|'''Value:'''||''family-name'', ''generic-name''
Line 39: Line 38:
|}
|}
   
   
----
==font-size==
===font-size===
{|
{|
|'''Value:'''||''absolute-size'', ''relative-size'', ''length'', ''percentage''
|'''Value:'''||''absolute-size'', ''relative-size'', ''length'', ''percentage''
Line 58: Line 56:
|}
|}
   
   
----
==font-style==
 
===font-style===
{|
{|
|'''Value:'''||normal, italic, oblique
|'''Value:'''||normal, italic, oblique
Line 78: Line 74:
|}
|}
   
   
----
==font-weight==
===font-weight===
{|
{|
|'''Value:'''||normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900
|'''Value:'''||normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900
Line 97: Line 92:
|}
|}
   
   
 
=Color and Background Properties=
==Color and Background Properties==
==color==
===color===
{|
{|
|'''Value:'''||''color name'', ''color code''
|'''Value:'''||''color name'', ''color code''
Line 117: Line 111:
|}
|}
   
   
----
==background==
===background===
{|
{|
|'''Value:'''||background-color, background-image, background-repeat, background-position
|'''Value:'''||background-color, background-image, background-repeat, background-position
Line 136: Line 129:
|}
|}
   
   
----
==background-color==
===background-color===
{|
{|
|'''Value:'''||''color name'', ''color code''
|'''Value:'''||''color name'', ''color code''
Line 155: Line 147:
|}
|}
   
   
----
==background-image==
===background-image===
{|
{|
|'''Value:'''||none, ''url''
|'''Value:'''||none, ''url''
Line 174: Line 165:
|}
|}
   
   
----
==background-repeat==
===background-repeat===
{|
{|
|'''Value:'''||repeat, repeat-x, repeat-y, no-repeat
|'''Value:'''||repeat, repeat-x, repeat-y, no-repeat
Line 193: Line 183:
|}
|}
   
   
----
==background-position==
===background-position===
{|
{|
|'''Value:'''||top, center, bottom, left, center, right
|'''Value:'''||top, center, bottom, left, center, right
Line 212: Line 201:
|}
|}
   
   
 
=Text Properties=
==Text Properties==
==text-align==
===text-align===
{|
{|
|'''Value:'''||left, right, center
|'''Value:'''||left, right, center
Line 232: Line 220:
|}
|}
   
   
----
==text-decoration==
===text-decoration===
{|
{|
|'''Value:'''||none, underline, line-through
|'''Value:'''||none, underline, line-through
Line 251: Line 238:
|}
|}
   
   
----
==vertical-align==
===vertical-align===
{|
{|
|'''Value:'''||baseline, sub, super
|'''Value:'''||baseline, sub, super
Line 270: Line 256:
|}
|}
   
   
 
=Box Properties=
==Box Properties==
==border-style==
===border-style===
{|
{|
|'''Value:'''||none, inset, outset
|'''Value:'''||none, inset, outset
Line 290: Line 275:
|}
|}
   
   
----
==margin==
===margin===
{|
{|
|'''Value:'''||''length'', auto
|'''Value:'''||''length'', auto
Line 309: Line 293:
|}
|}
   
   
----
==margin-top==
===margin-top===
{|
{|
|'''Value:'''||''length'', auto
|'''Value:'''||''length'', auto
Line 328: Line 311:
|}
|}
   
   
----
==margin-right==
===margin-right===
{|
{|
|'''Value:'''||''length'', auto
|'''Value:'''||''length'', auto
Line 347: Line 329:
|}
|}
   
   
----
==margin-bottom==
===margin-bottom===
{|
{|
|'''Value:'''||''length'', auto
|'''Value:'''||''length'', auto
Line 366: Line 347:
|}
|}
   
   
----
==margin-left==
===margin-left===
{|
{|
|'''Value:'''||''length'', auto
|'''Value:'''||''length'', auto
Line 385: Line 365:
|}
|}
   
   
----
==padding==
===padding===
{|
{|
|'''Value:'''||''length''
|'''Value:'''||''length''
Line 404: Line 383:
|}
|}
   
   
----
==padding-top==
===padding-top===
{|
{|
|'''Value:'''||''length''
|'''Value:'''||''length''
Line 423: Line 401:
|}
|}
   
   
----
==padding-right==
===padding-right===
{|
{|
|'''Value:'''||''length''
|'''Value:'''||''length''
Line 442: Line 419:
|}
|}
   
   
----
==padding-bottom==
===padding-bottom===
{|
{|
|'''Value:'''||''length''
|'''Value:'''||''length''
Line 461: Line 437:
|}
|}
   
   
----
==padding-left==
===padding-left===
{|
{|
|'''Value:'''||''length''
|'''Value:'''||''length''
Line 480: Line 455:
|}
|}
   
   
 
=Classification Properties=
==Classification Properties==
==list-style-type==
===list-style-type===
{|
{|
|'''Value:'''||none, disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha
|'''Value:'''||none, disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha
Line 500: Line 474:
|}
|}
   
   
----
==list-style-position==
===list-style-position===
{|
{|
|'''Value:'''||inside, outside
|'''Value:'''||inside, outside

Revision as of 21:40, 5 March 2009

MapTool supports a subset of the CSS level 1 specification. These styles can be used in-line, and also as external styles within dialogs and frames. This is not meant to be an exhaustive reference, nor an introduction to CSS, this page is only a collection of which properties are supported and to what extent.

Font Properties

font

Value: font-style, font-weight, font-size, font-family
Initial: none
Applies To: all elements
Inherited: yes
Relative Size: only font-size
Example:
font: bold italic 12pt Arial, Helvetica, sans-serif;

font-family

Value: family-name, generic-name
Initial: system default
Applies To: all elements
Inherited: yes
Relative Size: N/A
Example:
font-family: Arial, Helvetica, sans-serif;

font-size

Value: absolute-size, relative-size, length, percentage
Initial: medium
Applies To: all elements
Inherited: yes
Relative Size: relative to parent element's font-size
Example:
font-size: 12pt;

font-style

Value: normal, italic, oblique
Initial: normal
Applies To: all elements
Inherited: yes
Relative Size: N/A
Example:
font-style: italic;

font-weight

Value: normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900
Initial: normal
Applies To: all elements
Inherited: yes
Relative Size: N/A
Example:
font-weight: bold;

Color and Background Properties

color

Value: color name, color code
Initial: element specific
Applies To: all elements
Inherited: yes
Relative Size: N/A
Example:
color: #FF0000;

background

Value: background-color, background-image, background-repeat, background-position
Initial: none
Applies To: all elements
Inherited: no
Relative Size: no
Example:
background: #0000FF url(image.jpg) no-repeat right top;

background-color

Value: color name, color code
Initial: transparent
Applies To: all elements
Inherited: no
Relative Size: N/A
Example:
background-color: #0000FF;

background-image

Value: none, url
Initial: none
Applies To: all elements
Inherited: no
Relative Size: N/A
Example:
background-image: url(image.jpg);

background-repeat

Value: repeat, repeat-x, repeat-y, no-repeat
Initial: repeat
Applies To: all elements
Inherited: no
Relative Size: N/A
Example:
background-repeat: no-repeat;

background-position

Value: top, center, bottom, left, center, right
Initial: top left
Applies To: block-level and replaced elements
Inherited: no
Relative Size: no
Example:
background-position: bottom right;

Text Properties

text-align

Value: left, right, center
Initial: element specific
Applies To: block-level elements
Inherited: yes
Relative Size: N/A
Example:
text-align: right;

text-decoration

Value: none, underline, line-through
Initial: none
Applies To: all elements
Inherited: no
Relative Size: no
Example:
text-decoration: line-through;

vertical-align

Value: baseline, sub, super
Initial: baseline
Applies To: inline elements
Inherited: no
Relative Size: no
Example:
vertical-align: super;

Box Properties

border-style

Value: none, inset, outset
Initial: none
Applies To: all elements
Inherited: no
Relative Size: N/A
Example:
border-style: inset;

margin

Value: length, auto
Initial: none
Applies To: all elements
Inherited: no
Relative Size: no
Example:
margin: 10px;

margin-top

Value: length, auto
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
margin-top: 10px;

margin-right

Value: length, auto
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
margin-right: 10px;

margin-bottom

Value: length, auto
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
margin-bottom: 10px;

margin-left

Value: length, auto
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
margin-left: 10px;

padding

Value: length
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
padding: 10px;

padding-top

Value: length
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
padding-top: 10px;

padding-right

Value: length
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
padding-right: 10px;

padding-bottom

Value: length
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
padding-bottom: 10px;

padding-left

Value: length
Initial: 0
Applies To: all elements
Inherited: no
Relative Size: no
Example:
padding-left: 10px;

Classification Properties

list-style-type

Value: none, disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha
Initial: disc
Applies To: list-item elements
Inherited: yes
Relative Size: N/A
Example:
list-style-type: square;

list-style-position

Value: inside, outside
Initial: outside
Applies To: list-item elements
Inherited: yes
Relative Size: N/A
Example:
list-style-position: inside;