1# Universal Styles 2 3 4You can set universal styles for components in the **style** attribute or **.css** files. 5 6 7| Name | Type | Default Value | Mandatory | Description | 8| ---------------------------------- | ---------------------------------------- | ----- | ---- | ---------------------------------------- | 9| width | <length> \| <percentage><sup>5+</sup> | - | No | Component width.<br><br>If this attribute is not set, the default value **0** is used. | 10| height | <length> \| <percentage><sup>5+</sup> | - | No | Component height.<br><br>If this attribute is not set, the default value **0** is used. | 11| padding | <length> | 0 | No | Shorthand attribute to set the padding for all sides in a declaration.<br>The attribute can have one to four values:<br>- If you set only one value, it specifies the padding for all the four sides.<br>- If you set two values, the first value specifies the top and bottom padding, and the second value specifies the left and right padding.<br>- If you set three values, the first value specifies the top padding, the second value specifies the left and right padding, and the third value specifies the bottom padding.<br>- If you set four values, they respectively specify the padding for top, right, bottom, and left sides (in clockwise order).| 12| padding-[left\|top\|right\|bottom] | <length> | 0 | No | Left, top, right, and bottom padding. | 13| margin | <length> \| <percentage><sup>5+</sup> | 0 | No | Shorthand attribute to set the margin for all sides in a declaration. The attribute can have one to four values:<br>- If you set only one value, it specifies the margin for all the four sides.<br>- If you set two values, the first value specifies the top and bottom margins, and the second value specifies the left and right margins.<br>- If you set three values, the first value specifies the top margin, the second value specifies the left and right margins, and the third value specifies the bottom margin.<br>- If you set four values, they respectively specify the margin for top, right, bottom, and left sides (in clockwise order).| 14| margin-[left\|top\|right\|bottom] | <length> \| <percentage><sup>5+</sup> | 0 | No | Left, top, right, and bottom margins. | 15| border-width | <length> | 0 | No | Shorthand attribute to set the margin for all sides. | 16| border-color | <color> | black | No | Shorthand attribute to set the color for all borders. | 17| border-radius | <length> | - | No | Radius of round-corner borders. | 18| background-color | <color> | - | No | Background color. | 19| opacity<sup>5+</sup> | number | 1 | No | Opacity of an element. The value ranges from **0** to **1**. The value **1** means opaque, and **0** means completely transparent. | 20| display | string | flex | No | Type of the box containing an element. Available values are as follows:<br>- **flex**: flexible layout<br>- **none**: not rendered| 21| [left\|top] | <length> \| <percentage><sup>6+</sup> | - | No | Edge of the element.<br>- **left**: left edge position of the element. This attribute defines the offset between the left edge of the margin area of a positioned element and left edge of its containing block.<br>- **top**: top edge position of the element. This attribute defines the offset between the top edge of a positioned element and that of a block included in the element.| 22 23 24> **NOTE** 25> 26> The aforementioned universal styles are not mandatory. 27> 28> Currently, the following color formats are supported: 29> - rgb(255, 255, 255) 30> 31> - rgba(255, 255, 255, 1.0) 32> 33> - HEX formats: \#rrggbb and \#aarrggbb 34> 35> - Enumeration format: as listed in Table 1. The enumeration format is not supported in the script. 36 37 38 **Table 1** Color enums 39 40| Name | Hexadecimal Code | Color | 41| -------------------- | -------- | ---------------------------------------- | 42| aliceblue | \#f0f8ff |  | 43| antiquewhite | \#faebd7 |  | 44| aqua | \#00ffff |  | 45| aquamarine | \#7fffd4 |  | 46| azure | \#f0ffff |  | 47| beige | \#f5f5dc |  | 48| bisque | \#ffe4c4 |  | 49| black | \#000000 |  | 50| blanchedalmond | \#ffebcd |  | 51| blue | \#0000ff |  | 52| blueviolet | \#8a2be2 |  | 53| brown | \#a52a2a |  | 54| burlywood | \#deB887 |  | 55| cadetblue | \#5f9ea0 |  | 56| chartreuse | \#7fff00 |  | 57| chocolate | \#d2691e |  | 58| coral | \#ff7f50 |  | 59| cornflowerblue | \#6495ed |  | 60| cornsilk | \#fff8dc |  | 61| crimson | \#dc143c |  | 62| cyan | \#00ffff |  | 63| darkblue | \#00008b |  | 64| darkcyan | \#008b8b |  | 65| darkgoldenrod | \#b8860b |  | 66| darkgray | \#a9a9a9 |  | 67| darkgreen | \#006400 |  | 68| darkgrey | \#a9a9a9 |  | 69| darkkhaki | \#bdb76b |  | 70| darkmagenta | \#8b008b |  | 71| darkolivegreen | \#556b2f |  | 72| darkorange | \#ff8c00 |  | 73| darkorchid | \#9932cc |  | 74| darkred | \#8b0000 |  | 75| darksalmon | \#e9967a |  | 76| darkseagreen | \#8fbc8f |  | 77| darkslateblue | \#483d8b |  | 78| darkslategray | \#2f4f4f |  | 79| darkslategrey | \#2f4f4f |  | 80| darkturquoise | \#00ced1 |  | 81| darkviolet | \#9400d3 |  | 82| deeppink | \#ff1493 |  | 83| deepskyblue | \#00bfff |  | 84| dimgray | \#696969 |  | 85| dimgrey | \#696969 |  | 86| dodgerblue | \#1e90ff |  | 87| firebrick | \#b22222 |  | 88| floralwhite | \#fffaf0 |  | 89| forestgreen | \#228b22 |  | 90| fuchsia | \#ff00ff |  | 91| gainsboro | \#dcdcdc |  | 92| ghostwhite | \#f8f8ff |  | 93| gold | \#ffd700 |  | 94| goldenrod | \#daa520 |  | 95| gray | \#808080 |  | 96| green | \#008000 |  | 97| greenyellow | \#adff2f |  | 98| grey | \#808080 |  | 99| honeydew | \#f0fff0 |  | 100| hotpink | \#ff69b4 |  | 101| indianred | \#cd5c5c |  | 102| indigo | \#4b0082 |  | 103| ivory | \#fffff0 |  | 104| khaki | \#f0e68c |  | 105| lavender | \#e6e6fa |  | 106| lavenderblush | \#fff0f5 |  | 107| lawngreen | \#7cfc00 |  | 108| lemonchiffon | \#fffacd |  | 109| lightblue | \#add8e6 |  | 110| lightcoral | \#f08080 |  | 111| lightcyan | \#e0ffff |  | 112| lightgoldenrodyellow | \#fafad2 |  | 113| lightgray | \#d3d3d3 |  | 114| lightgreen | \#90ee90 |  | 115| lightpink | \#ffb6c1 |  | 116| lightsalmon | \#ffa07a |  | 117| lightseagreen | \#20b2aa |  | 118| lightskyblue | \#87cefa |  | 119| lightslategray | \#778899 |  | 120| lightslategrey | \#778899 |  | 121| lightsteelblue | \#b0c4de |  | 122| lightyellow | \#ffffe0 |  | 123| lime | \#00ff00 |  | 124| limegreen | \#32cd32 |  | 125| linen | \#faf0e6 |  | 126| magenta | \#ff00ff |  | 127| maroon | \#800000 |  | 128| mediumaquamarine | \#66cdaa |  | 129| mediumblue | \#0000cd |  | 130| mediumorchid | \#ba55d3 |  | 131| mediumpurple | \#9370db |  | 132| mediumseagreen | \#3cb371 |  | 133| mediumslateblue | \#7b68ee |  | 134| mediumspringgreen | \#00fa9a |  | 135| mediumturquoise | \#48d1cc |  | 136| mediumvioletred | \#c71585 |  | 137| midnightblue | \#191970 |  | 138| mintcream | \#f5fffa |  | 139| mistyrose | \#ffe4e1 |  | 140| moccasin | \#ffe4b5 |  | 141| navajowhite | \#ffdead |  | 142| navy | \#000080 |  | 143| oldlace | \#fdf5e6 |  | 144| olive | \#808000 |  | 145| olivedrab | \#6b8e23 |  | 146| orange | \#ffa500 |  | 147| orangered | \#ff4500 |  | 148| orchid | \#da70d6 |  | 149| palegoldenrod | \#eee8aa |  | 150| palegreen | \#98fb98 |  | 151| paleturquoise | \#afeeee |  | 152| palevioletred | \#db7093 |  | 153| papayawhip | \#ffefd5 |  | 154| peachpuff | \#ffdab9 |  | 155| peru | \#cd853f |  | 156| pink | \#ffc0cb |  | 157| plum | \#dda0dd |  | 158| powderblue | \#b0e0e6 |  | 159| purple | \#800080 |  | 160| rebeccapurple | \#663399 |  | 161| red | \#ff0000 |  | 162| rosybrown | \#bc8f8f |  | 163| royalblue | \#4169e1 |  | 164| saddlebrown | \#8b4513 |  | 165| salmon | \#fa8072 |  | 166| sandybrown | \#f4a460 |  | 167| seagreen | \#2e8b57 |  | 168| seashell | \#fff5ee |  | 169| sienna | \#a0522d |  | 170| silver | \#c0c0c0 |  | 171| skyblue | \#87ceeb |  | 172| slateblue | \#6a5acd |  | 173| slategray | \#708090 |  | 174| slategrey | \#708090 |  | 175| snow | \#fffafa |  | 176| springgreen | \#00ff7f |  | 177| steelblue | \#4682b4 |  | 178| tan | \#d2b48c |  | 179| teal | \#008080 |  | 180| thistle | \#d8Bfd8 |  | 181| tomato | \#ff6347 |  | 182| turquoise | \#40e0d0 |  | 183| violet | \#ee82ee |  | 184| wheat | \#f5deb3 |  | 185| white | \#ffffff |  | 186| whitesmoke | \#f5f5f5 |  | 187| yellow | \#ffff00 |  | 188| yellowgreen | \#9acd32 |  | 189
