<body>
<div id=main byondclass=child skinparams="left:map;right:output;splitter:50">
<div id=map byondclass=map></div>
<div id=output byondclass=output></div>
</div>
<div id=input byondclass=input></div>
</body>
Explain to me the parts of this skin.
Which part(s) says the control(s) I want?
Which part(s) says what class they are - the control(s)?
Last which part(s) says what type each control(s) is?
The data tree (in some makeshift looking markup pseudocode):
BODY {
DIV (id = main) (byondclass = child) (skinparams = [left = map, right = output, splitter = 50]) {
DIV (id = map) (byondclass = map) {}
DIV (id = output) (byondclass = output) {}
}
DIV (id = input) (byondclass = input) {}
}
ID:
used in CSS and JS to identify an element in the DOM (Data Object Model), or data tree.
byondclass:
Used by BYOND to identify which element is used for skin controls, in the example above:
child = A child control
map = A map control
output = an output control
input = an input control
skinparams:
Used by BYOND to specify the skin control's parameters. These are pretty much identical to how Skin Controls were used. In the example for the child control:
left:map; = control's left pane is ID "map"
right:output; = control's right pane is ID "output"
splitter:50; = the child splits vertically at 50%.
a DIV tag in HTML is generally used as a container for other tags, and is usually used for organization. You can use other tags besides DIV, but it's best suited to use these because of their flexibility.
The BODY tag is necessary to show any content in am HTML webpage. It specifies the data in a webpage itself.