Servoy supports a subset of the CSS3 style properties:
Specifying colors
When specifying color values, there are four ways to specify the color:
- color value: red;
- hexadecimal value: #ff0000;
- rgb value: rgb(255,0,0);
- rgba value: rgba(255,0,0,0.1)
For possible values, see: http://www.w3schools.com/css/css_colornames.asp
. Servoy does not support CSS system colors
Unknown macro: {table}
{column:width=120px}{column}
{column}{column}
{column}{column}
{column}{column}
Unknown macro: {tr}
Unknown macro: {th}
Property
Unknown macro: {th}
Values
Unknown macro: {th}
Examples
Unknown macro: {th}
Comment
Unknown macro: {tr}
Unknown macro: {td}
color
Unknown macro: {td}
Unknown macro: {td}
color: green;
color: #00ff00;
color: rgb(0,255,0);
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
text-align
Unknown macro: {td}
left, right, center, justify
Unknown macro: {td}
text-align: left;
Unknown macro: {td}
horizontal text alignment
Unknown macro: {tr}
Unknown macro: {td}
vertical-align
Unknown macro: {td}
baseline, sub, super, top, text-top, middle, bottom, text-bottom
Unknown macro: {td}
vertical-align: top;
Unknown macro: {td}
vertical text alignment
Unknown macro: {tr}
Unknown macro: {td}
font
Unknown macro: {td}
Unknown macro: {td}
font: bold 10pt Verdana;
Unknown macro: {td}
Shorthand notation: specifies the entire font styling
Unknown macro: {tr}
Unknown macro: {td}
font-family
Unknown macro: {td}
font family names, comma separated
Unknown macro: {td}
font-family: Verdana, Arial, "Century Schoolbook"
Unknown macro: {td}
Add multiple font families in case one is not available. Font family names containing spaces must be enclosed in quotes
Unknown macro: {tr}
Unknown macro: {td}
font-style
Unknown macro: {td}
normal, italic, oblique
Unknown macro: {td}
font-style: italic;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
font-variant
Unknown macro: {td}
normal, small-caps
Unknown macro: {td}
font-variant: small-caps;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
font-weight
Unknown macro: {td}
normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900
Unknown macro: {td}
font-weight: bold;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
font-size
Unknown macro: {td}
pt, px, percentage, length, smaller, larger, small, x-small, xx-small, medium, large, x-large, xx-large
Unknown macro: {td}
font-size: 12px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
background
Unknown macro: {td}
Unknown macro: {td}
background: #00ff00 url(media:///myImage.png) no-repeat fixed center;
Unknown macro: {td}
Shorthand notation: specifies the entire background styling
Unknown macro: {tr}
Unknown macro: {td}
background-color
Unknown macro: {td}
Unknown macro: {td}
background-color: red;
background-color: #ff0000;
background-color: rgb(255,0,0);
Unknown macro: {td}
Unknown macro: {td}
background-image
Unknown macro: {td}
Can be an image from url or a linear gradient.
Unknown macro: {td}
background-image: url(media:///myImage.png);
background-image:linear-gradient(top,#fefcea,#f1da36);
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
background-repeat
Unknown macro: {td}
repeat, repeat-x, repeat-y, no-repeat
Unknown macro: {td}
background-repeat: no-repeat;
Unknown macro: {td}
Specifies repeating pattern of background image. Default value is repeat.
Unknown macro: {td}
background-position
Unknown macro: {td}
Unknown macro: {td}
background-position: left top;
background-position: 100px 50px;
background-position: 50%;
Unknown macro: {td}
Specifies background image position relative to its container. First value is horizontal position second one is vertical position. Supported values are using keywords, pixels or percentages.
Unknown macro: {tr}
Unknown macro: {td}
background-size
Unknown macro: {td}
Unknown macro: {td}
background-size: 50%; 100%
background-size: 100px 50px;
background-size: cover;
Unknown macro: {td}
Specifies background image size relative to its container. First value is image height, second one is image width. Supported values are using keywords (cover and contain), pixels or percentages.
Unknown macro: {td}
background-attachment
Unknown macro: {td}
scroll,fixed
Unknown macro: {td}
background-attachment: fixed;
Unknown macro: {td}
Specifies how background image is attached to container.
Unknown macro: {tr}
Unknown macro: {td}
opacity
Unknown macro: {td}
Numbers between 0 and 1.
Unknown macro: {td}
opacity: 0.5;
Unknown macro: {td}
Opacity level of an element. Default value is 1.
Unknown macro: {tr}
Unknown macro: {td}
border
Unknown macro: {td}
[border-width] border-style [border-color]
Unknown macro: {td}
border: 1px solid black;
Unknown macro: {td}
Shorthand notation: sets the entire border styling
Unknown macro: {tr}
Unknown macro: {td}
border-width
Unknown macro: {td}
px, thin, medium, thick
Unknown macro: {td}
border-width: 1px;
border-width: 1px 2px 3px 4px;
Unknown macro: {td}
Sets all border widths
top: 1st value
right: 2nd value (fallback to first)
bottom: 3rd value (fallback to 1st)
left: 4th value, fallback to 2nd value, otherwise 1st value)
Unknown macro: {tr}
Unknown macro: {td}
border-top-width
Unknown macro: {td}
Unknown macro: {td}
border-top-width: 1px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-right-width
Unknown macro: {td}
Unknown macro: {td}
border-right-width: 2px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-bottom-width
Unknown macro: {td}
Unknown macro: {td}
border-bottom-width: 3px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-left-width
Unknown macro: {td}
Unknown macro: {td}
border-left-width: 4px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-color
Unknown macro: {td}
Unknown macro: {td}
border-color: red;
border-color: red green blue yellow;
Unknown macro: {td}
Sets all border colors:
top: 1st value
right: 2nd value (fallback to first)
bottom: 3rd value (fallback to 1st)
left: 4th value, fallback to 2nd value, otherwise 1st value)
Unknown macro: {tr}
Unknown macro: {td}
border-top-color
Unknown macro: {td}
Unknown macro: {td}
border-top-color: red;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-right-color
Unknown macro: {td}
Unknown macro: {td}
border-right-color: green;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-bottom-color
Unknown macro: {td}
Unknown macro: {td}
border-bottom-color: blue;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-left-color
Unknown macro: {td}
Unknown macro: {td}
border-left-color: yellow;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-style
Unknown macro: {td}
none, solid, double, groove, ridge, inset, outset
Unknown macro: {td}
border-style: solid;
border-style: solid double none inset;
Unknown macro: {td}
Sets all border styles:
top: 1st value
right: 2nd value (fallback to first)
bottom: 3rd value (fallback to 1st)
left: 4th value, fallback to 2nd value, otherwise 1st value)
Unknown macro: {tr}
Unknown macro: {td}
border-top-style
Unknown macro: {td}
Unknown macro: {td}
border-top-style: solid;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-right-style
Unknown macro: {td}
Unknown macro: {td}
border-right-style: double;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-bottom-style
Unknown macro: {td}
Unknown macro: {td}
border-bottom-style: none;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-left-style
Unknown macro: {td}
Unknown macro: {td}
border-left-style: inset;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-radius
Unknown macro: {td}
Unknown macro: {td}
border-radius: 50px;
border-radius: 50px 0px 0px 0px / 20px 0px 0px 0px;
border-radius: 50px 0px 0px 0px
Unknown macro: {td}
Shorthand definition of border radius. The four values for each radii are given in the order top-left, top-right, bottom-right, bottom-left. First set defines horizontal radii, second set vertical radii.
Unknown macro: {tr}
Unknown macro: {td}
border-top-left-radius
Unknown macro: {td}
Unknown macro: {td}
border-top-left-radius: 50px 10px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-top-right-radius
Unknown macro: {td}
Unknown macro: {td}
border-top-right-radius: 50px 10px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-bottom-right-radius
Unknown macro: {td}
Unknown macro: {td}
border-bottom-right-radius: 50px 10px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
border-bottom-left-radius
Unknown macro: {td}
Unknown macro: {td}
border-bottom-left-radius: 50px 10px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
margin
Unknown macro: {td}
px, auto
Unknown macro: {td}
margin: 1px;
margin: 1px 2px 3px 4px;
Unknown macro: {td}
Sets all margin widths
top: 1st value
right: 2nd value (fallback to first)
bottom: 3rd value (fallback to 1st)
left: 4th value, fallback to 2nd value, otherwise 1st value).
NOTE: the order for the Servoy margin property in the Designer is top, left, bottom, right.
Unknown macro: {tr}
Unknown macro: {td}
margin-top
Unknown macro: {td}
Unknown macro: {td}
margin-top: 1px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
margin-right
Unknown macro: {td}
Unknown macro: {td}
margin-right: 2px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
margin-bottom
Unknown macro: {td}
Unknown macro: {td}
margin-bottom: 3px;
Unknown macro: {td}
Unknown macro: {tr}
Unknown macro: {td}
margin-left
Unknown macro: {td}
Unknown macro: {td}
margin-left: 4px;
Unknown macro: {td}
Overview
Content Tools
Activity