Supported CSS Styles
ADVANCED
THIS IS AN ADVANCED ARTICLE
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. If you are looking for an introduction to CSS, visit W3Schools CSS Tutorial
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-style
| Value: |
normal, italic, oblique
|
| Initial: |
normal
|
| Applies To: |
all elements
|
| Inherited: |
yes
|
| Relative Size: |
N/A
|
| Example: |
|
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: |
|
Color and Background Properties
color
| Value: |
color name, color code
|
| Initial: |
element specific
|
| Applies To: |
all elements
|
| Inherited: |
yes
|
| Relative Size: |
N/A
|
| Example: |
|
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(asset://de05e42d2eb43fe53a542db116da8083) 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(asset://de05e42d2eb43fe53a542db116da8083);
|
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-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: |
|
Box Properties
border-style
| Value: |
none, inset, outset
|
| Initial: |
none
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
N/A
|
| Example: |
|
margin
| Value: |
length, auto
|
| Initial: |
none
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
margin-top
| Value: |
length, auto
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
margin-right
| Value: |
length, auto
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
margin-bottom
| Value: |
length, auto
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
margin-left
| Value: |
length, auto
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
padding
| Value: |
length
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
padding-top
| Value: |
length
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
padding-right
| Value: |
length
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
padding-bottom
| Value: |
length
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
padding-left
| Value: |
length
|
| Initial: |
0
|
| Applies To: |
all elements
|
| Inherited: |
no
|
| Relative Size: |
no
|
| Example: |
|
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-position
| Value: |
inside, outside
|
| Initial: |
outside
|
| Applies To: |
list-item elements
|
| Inherited: |
yes
|
| Relative Size: |
N/A
|
| Example: |
list-style-position: inside;
|
Dialog: A modeless (''i.e.'', does not require user interaction) popup generated by the dialog roll option.Frame: A dockable MapTool window that can be generated via the frame roll option.