Style

AppStudio programs run within a special version of a web browser. As a result, they can inherit a lot of the properties of the environment they run in. You can access these properties from within your app, either in code or in the style property in the Properties Window.

Naming Convention

There are two naming conventions for style which are made up of more than one word.

• CSS: words are all lower case, separated by dashes. Example: border-bottom-style

• JavaScript: words are combined into one string. First word is all lower case. Each subsequent word starts with a capital letter. Example: borderBottomStyle

It is not a complete list: there are additional items in the full HTML documentation. In addition, some browsers may have additional members not shown here.

To set style properties for a Control, Form or the Project, edit the style property in the Properties Window using the CSS style. If you are setting more than one style, separate using semicolons. All styles must be on a single line.

  border-bottom-color:red; border-top-color:blue;

To set style properties in your code, use the JavaScript form:

  Button1.style.borderBottomColor = "red"
  Button1.style.borderTopColor = "blue"

list of style properties

background	Sets or returns all the background properties in one declaration
backgroundAttachment	Sets or returns whether a background-image is fixed or scrolls with the page
backgroundColor	Sets or returns the background-color of an element
backgroundImage	Sets or returns the background-image for an element. document.body.style.backgroundImage="url(http://www.nsbasic.com/images/eiffel.gif)" or if using jQuery Mobile $("div[data-role=""page""]").css("background-image", "url(myimage.jpg)")
backgroundPosition	Sets or returns the starting position of a background-image
backgroundRepeat	Sets or returns how to repeat (tile) a background-image
border	Sets or returns border-width, border-style, and border-color in one declaration
borderBottom	Sets or returns all the borderBottom* properties in one declaration
borderBottomColor	Sets or returns the color of the bottom border
borderBottomStyle	Sets or returns the style of the bottom border
borderBottomWidth	Sets or returns the width of the bottom border
borderCollapse	Sets or returns whether the table border should be collapsed into a single border, or not
borderColor	Sets or returns the color of an element's border (can have up to four values)
borderLeft	Sets or returns all the borderLeft* properties in one declaration
borderLeftColor	Sets or returns the color of the left border
borderLeftStyle	Sets or returns the style of the left border
borderLeftWidth	Sets or returns the width of the left border
borderRight	Sets or returns all the borderRight* properties in one declaration
borderRightColor	Sets or returns the color of the right border
borderRightStyle	Sets or returns the style of the right border
borderRightWidth	Sets or returns the width of the right border
borderSpacing	Sets or returns the space between cells in a table
borderStyle	Sets or returns the style of an element's border (can have up to four values)
borderTop	Sets or returns all the borderTop* properties in one declaration
borderTopColor	Sets or returns the color of the top border
borderTopStyle	Sets or returns the style of the top border
borderTopWidth	Sets or returns the width of the top border
borderWidth	Sets or returns the width of an element's border (can have up to four values)
bottom	Sets or returns the bottom position of a positioned element
captionSide	Sets or returns the position of the table caption
clear	Sets or returns the position of the element relative to floating objects
clip	Sets or returns which part of a positioned element is visible
color	Sets or returns the color of the text
content	Sets or returns the generated content before or after the element
counterIncrement	Sets or returns the list of counters and increment values
counterReset	Sets or returns the list of counters and their initial values
cssFloat	Sets or returns the horizontal alignment of an object
cssText	Sets or returns the contents of a style declaration as a string
cursor	Sets or returns the type of cursor to display for the mouse pointer
direction	Sets or returns the text direction
display	Sets or returns an element's display type
emptyCells	Sets or returns whether to show the border and background of empty cells, or not
font	Sets or returns font-style, font-variant, font-weight, font-size, line-height, and font-family in one declaration
fontFamily	Sets or returns the font face for text
fontSize	Sets or returns the font size of the text
fontSizeAdjust	Sets or returns the font aspect value
fontStyle	Sets or returns whether the style of the font is normal, italic or oblique
fontVariant	Sets or returns whether the font should be displayed in small capital letters
fontWeight	Sets or returns the boldness of the font
height	Sets or returns the height of an element
left	Sets or returns the left position of a positioned element
letterSpacing	Sets or returns the space between characters in a text
lineHeight	Sets or returns the distance between lines in a text
listStyle	Sets or returns list-style-image, list-style-position, and list-style-type in one declaration
listStyleImage	Sets or returns an image as the list-item marker
listStylePosition	Sets or returns the position of the list-item marker
listStyleType	Sets or returns the list-item marker type
margin	Sets or returns the margins of an element (can have up to four values)
marginBottom	Sets or returns the bottom margin of an element
marginLeft	Sets or returns the left margin of an element
marginRight	Sets or returns the right margin of an element
marginTop	Sets or returns the top margin of an element
maxHeight	Sets or returns the maximum height of an element
maxWidth	Sets or returns the maximum width of an element
minHeight	Sets or returns the minimum height of an element
minWidth	Sets or returns the minimum width of an element
orphans	Sets or returns the minimum number of lines for an element that must be visible at the bottom of a page
outline	Sets or returns all the outline properties in one declaration
outlineColor	Sets or returns the color of the outline around a element
outlineStyle	Sets or returns the style of the outline around an element
outlineWidth	Sets or returns the width of the outline around an element
overflow	Sets or returns what to do with content that renders outside the element box
padding	Sets or returns the padding of an element (can have up to four values)
paddingBottom	Sets or returns the bottom padding of an element
paddingLeft	Sets or returns the left padding of an element
paddingRight	Sets or returns the right padding of an element
paddingTop	Sets or returns the top padding of an element
pageBreakAfter	Sets or returns the page-break behavior after an element
pageBreakBefore	Sets or returns the page-break behavior before an element
pageBreakInside	Sets or returns the page-break behavior inside an element
position	Sets or returns the type of positioning method used for an element (static, relative, absolute or fixed)
quotes	Sets or returns the type of quotation marks for embedded quotations
right	Sets or returns the right position of a positioned element
tableLayout	Sets or returns the way to lay out table cells, rows, and columns
textAlign	Sets or returns the horizontal alignment of text
textDecoration	Sets or returns the decoration of a text
textIndent	Sets or returns the indentation of the first line of text
textShadow	Sets or returns the shadow effect of a text
textTransform	Sets or returns the case of a text
top	Sets or returns the top position of a positioned element
unicodeBidi	Sets or returns whether the text should be overridden to support multiple languages in the same document
verticalAlign	Sets or returns the vertical alignment of the content in an element
visibility	Sets or returns whether an element should be visible
whiteSpace	Sets or returns how to handle tabs, line breaks and whitespace in a text
widows	Sets or returns the minimum number of lines for an element that must be visible at the top of a page
width	Sets or returns the width of an element
wordSpacing	Sets or returns the spacing between words in a text
zIndex	Sets or returns the stack order of a positioned element. Sometimes called zorder on other platforms.