More actions
m Change ref link. Add sample. |
Proton One (talk | contribs) Adding design variable colors |
||
| (2 intermediate revisions by one other user not shown) | |||
| Line 3: | Line 3: | ||
; Syntax | ; Syntax | ||
: {{T|Co| | : {{T|Co|text color|background color|text}} | ||
: {{T|Co| | : {{T|Co|text color|text}} | ||
: Sample | :; Parameters | ||
::; text color : Sets the text color. Default value is "inherit"<ref>inherit - The color used by the HTML parent element.</ref>. Text color is passed through {{t|design var}} to automatically interpret and replace select color names with design variables. Colors can be given either by color name<ref>https://www.w3schools.com/colors/colors_names.asp [2022-05-29]</ref> (e.g. {{Co|red|red}} or {{Co|green|green}}) or values<ref>https://www.w3schools.com/colors/colors_hex.asp [2022-05-29]</ref> (like {{Co|#FF0000|#FF0000}}). | |||
::; background color : Sets the background color. Default value is "inherit". For valid values see text color. | |||
::; text : The text to be colored. | |||
; Sample | |||
: {{code|<nowiki>{{co|red|This text isn't yellow.}}</nowiki>}} gives ... | : {{code|<nowiki>{{co|red|This text isn't yellow.}}</nowiki>}} gives ... | ||
: {{co|red||This text isn't yellow.}} | : {{co|red||This text isn't yellow.}} | ||
| Line 16: | Line 18: | ||
: {{co||green|This text has a green background.}}<br> | : {{co||green|This text has a green background.}}<br> | ||
{{Note|Note the double | {{Note|Note the double pipe char <nowiki>||</nowiki> which means that that section is empty. The background color parameter may be safely omitted without the use of double pipes, but double pipes must be used if only a background color is desired.}} | ||
: {{code|<nowiki>{{co|black|lightyellow|Text and background color.}}</nowiki>}} gives ... | : {{code|<nowiki>{{co|black|lightyellow|Text and background color.}}</nowiki>}} gives ... | ||
Latest revision as of 03:25, 3 December 2025
- Description
- This template is used to color some text.
- Parameters
-
- text color
- Sets the text color. Default value is "inherit"[1]. Text color is passed through {{design var}} to automatically interpret and replace select color names with design variables. Colors can be given either by color name[2] (e.g. red or green) or values[3] (like #FF0000).
- background color
- Sets the background color. Default value is "inherit". For valid values see text color.
- text
- The text to be colored.
- Sample
gives ...{{co|red|This text isn't yellow.}} - This text isn't yellow.
gives ...{{co||green|This text has a green background.}} - This text has a green background.
 Note:
|
Note the double pipe char || which means that that section is empty. The background color parameter may be safely omitted without the use of double pipes, but double pipes must be used if only a background color is desired. |
gives ...{{co|black|lightyellow|Text and background color.}} - Text and background color.
gives ...{{co|#0033CC|This text uses an hex color code.}} - This text uses an hex color code.
- References
- ^ inherit - The color used by the HTML parent element.
- ^ https://www.w3schools.com/colors/colors_names.asp [2022-05-29]
- ^ https://www.w3schools.com/colors/colors_hex.asp [2022-05-29]