Properties and Values

\n\n\n\n[[row]]\n[[cell]]\n[[div style=\"margin: auto; width: 15px;\"]]\n[[div style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"margin: auto; width: 15px;\"]\n[[div style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777; margin-left: 2px;\"]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777; margin-left: 2px;\"]\n[style=\"margin: auto; width: 15px;\"]\n[[div style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777; margin-left: 4px;\"]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 11px; margin-bottom: 2px; border-bottom: 1px solid #777; margin-left: 4px;\"]\n[style=\"margin: auto; width: 15px;\"]\n[[div style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[style=\"width: 15px; margin-bottom: 2px; border-bottom: 1px solid #777;\"]\n[[/div]]\n[[/div]]\n[[/cell]]\n[[/row]][[/table]]"
template: '11644404'
Read More...
[[/cell]]
[[/row]]
Property Description
background description: 'This property is the shorthand for setting the background of an element.'
values: "* background: color position size repeat origin clip attachment image;\n* Each sub-value corresponds with the background-property of the same name below. Note that these values can be in a different order, within reason, and that not all values need to be specified.\n\n* background: none;\n* Eliminates the background entirely.\n\n* background: inherit;\n* Inherits background values from parent element."
details: "This single property name combines each of the background properties for convenience:\n* background-color\n* background-position\n* background-size\n* background-repeat\n* background-origin\n* background-clip\n* background-attachment\n* background-image\n\nNote that not all of these sub-properties exist for older versions of browsers, particularly those that do no support CSS3."
template: '14235022'
Read More...
border description: 'This property is shorthand for setting the main border properties of an element, including width, style, and color.'
values: "* border: width style color;\n* Sets the standard width, style, and color of an element's borders.\n\n* border: none;\n* Sets an element to have no borders\n\n* border: inherit;\n* Inherits border values from parent element."
details: "This single property name combines three main border properties for convenience:\n* border-width\n* border-style\n* border-color\n\nThis property will set all four borders of an element. To set individual borders (such as only the bottom border), append the border property with the specified side:\n* border-top\n* border-right\n* border-bottom\n* border-left"
template: '11640680'
Read More...
box-shadow description: 'This generates a shadow effect around or within a box element.'
values: "* box-shadow: h-tran v-tran;\n* Sets the horizontal and vertical translations of the shadow, respectively.\n\n* box-shadow: h-tran v-tran blur;\n* Sets the horizontal and vertical translations of the shadow, respectively. Also applies a blur for blur pixels.\n\n* box-shadow: h-tran v-tran color;\n* Sets the horizontal and vertical translations of the shadow as well as its color.\n\n* box-shadow: h-tran v-tran blur color;\n* Sets the horizontal and vertical translations, the blur distance, and color of the shadow.\n\n* box-shadow: h-tran v-tran blur spread;\n* Sets the horizontal and vertical translations, the blur distance, and the spread distance (the size of the shadow).\n\n* box-shadow: h-tran v-tran blur spread color;\n* Sets the horizontal and vertical translations, the blur distance, the spread distance, and the color of the shadow.\n\n* box-shadow: (any of the above) inset;\n* Places the shadow within the element rather than outside.\n\n* box-shadow: none;\n* Removes any shadow effect from the element."
details: "The box-shadow property transforms an element's shadow(s). Using the above syntax combinations, the following attributes of the shadow can be applied:\n* h-tran: Set the horizontal translation of the shadow. Negative values move the shadow to the left.\n* v-tran: Set the vertical translation of the shadow. Negative values move the shadow up.\n* blur: By default, the shadow looks like another box. This value allows the shadow to be blurred on the edges for blur pixels. The larger the value, the more blur is applied.\n* spread: By default, the shadow is the same shape and size as the element. This value increases the shadow's size for positive values and decreases the size for negative values.\n* color: The shadow is black (#000) by default.\n* inset: If this is added, then the shadow will appear inside the element rather than outside.\n\nMultiple shadows can be applied to a single element using commas to separate individual instances of the above syntaxes. For example:\n\n* box-shadow: 10px 10px #F00, -10px -10px #00F;\n\nNote: Abusing the use of the box-shadow property may cause significant lag on individual pages."
template: '12512355'
Read More...
color description: 'Specifies the color of the text.'
values: "* color: value;\n* The value can be any string, hexadecimal, or rgb color value. See Colors.\n\n* color: transparent;\n* The color for the text will essentially match its background."
details: "This property will define the color of the text for the selected element and its descendents.\n\nTheoretically, you could make the text \"invisible\" by making it the same color as the background. This isn't as effective on multi-colored images unless transparent is passed, which isn't supported by every major browser."
template: '11640885'
Read More...
margin description: 'Margin is the shorthand property for defining the distance of an element from other elements along all sides.'
values: "* margin: top right bottom left;\n* Sets the individual margins for each side.\n\n* margin: top-bottom right-left;\n* Two values can be passed instead of four. The first sets the top and bottom; the second sets the right and left.\n\n* margin: top right-left bottom;\n* If three values are passed, the first sets the top margin, the second sets the right and left, and the last sets the bottom.\n\n* margin: all;\n* A single value will set all four margins for the selected element.\n\n* margin: auto;\n* The browser calculates its own margins, usually centering the block.\n\n* margin: inherit;\n* The element inherits the margin settings of the parent element."
details: "Margin adjust spacing between blocks and elements. If I had a div block, the margin of that div block adjusts its distance from all the elements around it.\n\nMargin values can be measured by pixels (px), em, or percentage (%).\n\nThis property is used to define all of the margins for an element. You can access individual sides as well:\n* margin-top\n* margin-right\n* margin-bottom\n* margin-left"
template: '11640942'
Read More...
opacity description: 'This sets the overall transparency of an element.'
values: "* opacity: value;\n* The value can be any number ranging from 0.0 (fully transparent) to 1.0 (fully opaque)\n\n* opacity: inherit;\n* Inherits opacity value from the parent element"
details: "The opacity property sets the transparency of an element. If you want an element to be fully transparent, meaning it cannot be seen, then set the value to 0.0. If you want the element to be fully opaque, which is default, then set it to 1.0.\n\nAny number in between, like 0.5, will produce a result somewhere between invisible and opaque. You would see the element but also get a glimpse of what is behind it.\n\nNote that older versions of Internet Explorer do not support this property. You must define this instead:\n\n* filter:Alpha(opacity=value);\n\nwhere the value is a percentage from 0 to 100."
template: '11717889'
Read More...
padding description: 'Padding is the shorthand property for defining the distance between the selected element and the elements inside of it.'
values: "* padding: top right bottom left;\n* Sets the padding for each side individually.\n\n* padding: top-bottom right-left;\n* Two values can be passed instead of four. The first sets the top and bottom; the second sets the right and left.\n\n* padding: top right-left bottom;\n* If three values are passed, the first sets the top padding, the second sets the right and left, and the last sets the bottom.\n\n* padding: all;\n* A single value will set the padding of all four sides of the selected element.\n\n* padding: inherit;\n* The element inherits the padding settings of the parent element."
details: "Padding adjusts the spacing inside of the element. If I had a div block with text in it, the padding would determine how far away that text is from the borders of the div.\n\nPadding values can be measured by pixels (px), em, or percentage (%). Note that you cannot have a negative padding.\n\nThis property is used to define the padding for each side of an element. You can access individual sides as well:\n* padding-top\n* padding-right\n* padding-bottom\n* padding-left"
template: '11642421'
Read More...
position description: 'This sets the method by which an element is positioned.'
values: "* position: static;\n* The element is positioned according to the document order. This is the default.\n\n* position: absolute;\n* Positions the element relative to the first non-static parent.\n\n* position: relative;\n* Positions the element relative to its normal position.\n\n* position: fixed;\n* The element is positioned relative to the browser window.\n\n* position: inherit;\n* Inherits the value of the parent element."
details: "Under default circumstances, elements are rendered in the order they appear on the document. In other words, if I had a div block followed by an image followed by a form, you would perceive the elements in this order, left to right, top to bottom. The position property allows you to be more flexible in where elements appear.\n\nWhen you specify a position value other than static, the top, right, bottom, and left properties become available for use. In summary, these properties position the element according to the method used (ie. the value supplied for the position property).\n\nThe example below clarifies the differences between the different values."
template: '14235180'
Read More...
text-align description: 'Specifies the horizontal alignment of text in an element.'
values: "* text-align: left;\n* The default value. Text is aligned to the left.\n\n* text-align: right;\n* Text is aligned to the right.\n\n* text-align: center;\n* Text is centered.\n\n* text-align: justify;\n* Spacing is adjusted on each line to assure that each line is aligned to both the right and left. Each line of text (except the last) will have equal length.\n\n* text-align: inherit;\n* The text alignment is inherited from the parent element."
details: "This property simply determines how text in an element is aligned. For visual representation, the following shows how the four main values relate to the symbols on a Word palette:\n\n[[table style=\"width: 100%;\"]]\n[[row]]\n[[cell style=\"text-align: center;\"]]Left
Center Right Justify
top description: 'Sets the location of the top edge of a non-static element.'
values: "* top: distance;\n* Distance from the top of the element defined by the position property.\n\n* top: auto;\n* Automatically places the top edge of the element. The default.\n\n* top: inherit;\n* Inherits the value from the parent element."
details: "If the position of the element is absolute, then this moves the element from the top of the first non-static parent the value placed in distance.\n\nIf the position is relative, then this moves the element from the top of its normal position.\n\nIf the position is fixed, then this moves the element from the top of the browser window.\n\nIf the position is static, this property has no effect.\n\nThe distance can be in px, em, or a %. Furthermore, negative values are allowed.\n\nNote: If both top and bottom are defined in the same selector, then the top value is taken."
template: '14235338'
Read More...
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License