模板:Composition bar compact
跳至導覽
跳至搜尋
50 / 100
File:Test Template Info-Icon - Version (2).svg 模板文件[檢視] [編輯] [歷史] [清除快取]
.svg){kind=link}
This template displays the numeric composition of a thing in terms of its sub-units. For example, it is frequently used as part of {{Infobox political party}} to show the number of seats a given political party holds in a legislature. It is a one-line variation of the two-line, fixed width Template:Composition bar.
Usage[編輯]
{{Composition bar compact|amount|total|bar-color|options...}}
- amount
- The first parameter is the number of sub-units.
- total
- The second parameter is the total number of sub-units possible.
- bar-color
- (default is medium-light grey) The third parameter is the background color of the left part of the bar - a valid web color, which can be specified by name, as a hex triplet (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)).
In the case of political parties, most will have their logo color available in{{political party/meta/color}}templates.
Additional display options:
- background-color=...
- (default is light grey) is the background color of the right part of the bar - a valid web color.
- color=...
- (default is inherit) is the color of the text
- text-shadow=...
- (default is white) is the color of the shadow around the text
- border=...
- (default is medium grey) is the color of a border around the bar, or "none" for no border
- width=...
- (default is 100px) is the width of the bar, set to "auto" for inline use, "100%" for most table uses (unitless numbers are interpreted as px)
- per=...
- (default is false), when set to any value (true), adds a percentage to the bar as well
- perstyle=...
- (default is none), additional style declarations for the percentage text
Some older Web browsers do not render text-shadows, so the text should ideally have enough contrast on its own. If the bar color is dark, lighten the text color, and darken the background-color and text-shadow. See the second and third examples below. Snook's Colour Contrast Check may be used to check compliance with WCAG guidelines for contrast.
Examples[編輯]
| Code | Result |
|---|---|
{{Composition bar compact|50|100|red}}
|
50 / 100 |
{{Composition bar compact|50|100|darkred|color=#FFF|text-shadow=#000|background-color=#333}}
|
50 / 100 |
{{Composition bar compact|50|100|#003|color=#FFF|text-shadow=#000|background-color=#333|border-color=#C33}}
|
50 / 100 |
{{Composition bar compact|50|100|{{Green Party (UK)/meta/color}}|border=none}}
|
50 / 100 |
{{Composition bar compact|50|100|rgb(255,255,16)|width=auto}}
|
50 / 100 |
{{Composition bar compact|75|100|#FF0|width=80%}}
|
75 / 100 |
{{Composition bar compact|40|100|#F00|per=1}}
|
40 / 100(40%) |
{{Composition bar compact|90|100|#F0F0F0|per=2|background-color=#F00}}
|
90 / 100(90%) |
{{Composition bar compact|90|100|#F0C|per=1}}
|
90 / 100(90%) |
TemplateData[編輯]
<templatedata> {
"description": "A composition bar.",
"params": {
"1": {
"label": "1",
"description": "The number of sub-units.",
"type": "string/line",
"required": true
},
"2": {
"label": "2",
"description": "The total number of sub-units possible.",
"type": "string/line",
"required": true
},
"3": {
"label": "3",
"description": "The background color of the left part of the bar - a valid web color, which can be specified by name, as a hex triplet (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)). In the case of political parties, most will have their logo color available in Template:Political party/meta/color templates.",
"default": "#CCCCCC",
"type": "string/line",
"required": false,
"aliases": ["hex"]
},
"background-color": {
"label": "Background color",
"description": "The background color of the right part of the bar - a valid web color.",
"default": "#F0F0F0",
"type": "string/line",
"required": false
},
"color": {
"label": "Text color",
"description": "The color of the overlay text",
"default": "inherit",
"type": "string/line",
"required": false
},
"text-shadow": {
"label": "Text shadow",
"description": "The color of the contrast shadow around the overlay text",
"default": "#FFFFFF",
"type": "string/line",
"required": false
},
"border": {
"label": "Border color",
"description": "Color of the border, or 'none' for no border",
"default": "#C0C0C0",
"type": "string/line",
"required": false,
"aliases": ["border-color"]
},
"width": {
"label": "Width",
"description": "The width of the bar (unitless numbers are interpreted as px)",
"default": "100px",
"type": "string/line",
"required": false
},
"per": {
"label": "Show percent",
"description": "When set to 1 (true), adds a percentage to the bar as well",
"default": "0",
"type": "string/line",
"required": false
},
"perstyle": {
"label": "Percent style",
"description": "Style declarations for the percentage text",
"default": "",
"type": "string/line",
"required": false
}
}
} </templatedata>
