Template:Lineheight

From MozillaWiki
Jump to: navigation, search

{{{1}}}

Documentation icon Template documentation[view] [edit] [history] [purge]

Usage

{{lineheight}} changes the line height for a text string through the CSS property line-height. It is primarily intended to be used with its default settings (not altering any parameters), i.e. for text spans that, for reasons of clarity, need or would benefit from a doubled line height.

The intended use is achieved by using the template syntax {{lineheight|custom text}}.

Parameters

There are 3 parameters, of which 1 is unnamed and required, and 2 are named and optional.

Syntax

The template's syntax is

  • {{lineheight|custom text |height= |tag= }}

Required parameter

1

Custom text string

The text for which you wish to change the line height. The parameter is unnamed, so no parameter name needs to be entered.

Usage
  • {{lineheight|1}}

Optional parameters

height

Line height

By default, the template sets the line height to the value 200% (of the current font size), i.e. double the normal line height in MozillaWiki. You can enter a custom line height value, if you want to. There are different ways of specifying this value. See the available value types below, under Available values.

Note
  • If the entered value doesn't conform to the rules, the template will output the text using MozillaWiki's standard line height.
Usage
  • {{lineheight|1|height=line height value}}
Available values
Type Value type Value Template default Comments
CSS CSS value inherit Value inherited from the parent element. Usually means normal MozillaWiki line height.
normal Normal line height. May not be equal to MozillaWiki's standard line height.
Length a) Number value + px/em e.g. 14px Negative values are invalid.
Use the decimal point, not the comma.
e.g. 2.5em
Percentage a) Number value + % e.g. 125%
200%
Line height in percent of current font size.
Number Number value e.g. 2.5 Gets multiplied with the current font size to give the line height.
Negative values are invalid.
Use the decimal point, not the comma.
NB! There's no unit, only a number.

a) When using length or percentage, there can't be any space character between the number value and its unit (px or em for length, and % for percentage).

tag

HTML tag

By default, the template outputs the text enclosed in <span> tags, but it is possible to change the |tag parameter value to one of a small number of other tag names. See the available value types below, under Available values.

Usage
  • {{lineheight|1|tag=tag value}}
Available values
Type Value Template default Comments
 HTML tag   blockquote  Will output the specified tag. 
 div
 p
 span
Green check.png
 Other HTML tags b)   Will output <span> tags. 

b) Any other HTML tag than the ones listed above will be ignored, and set the template to use <span> tags.

Examples

Correct use

Parameter Value What you type What you see Comments
(none)
Control sample
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] Normal MozillaWiki line height output.
1 (text)
Only text
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] Text automatically set to 200% line height, and output in <span> tags.
height
inherited
height=inherited|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} <br><br>Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.</div>
Deyr fé,
deyja frændur,
deyr sjálfur ið sama.
Eg veit einn
að aldrei deyr:
dómur um dauðan hvern.

At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]

Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.
The line height value is inherited from the parent <div> element.
normal
height=normal|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} <br><br>Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.</div>
Deyr fé,
deyja frændur,
deyr sjálfur ið sama.
Eg veit einn
að aldrei deyr:
dómur um dauðan hvern.

At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]

Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.
The text within the template is output with normal line height (or any other line height specified as a valid value), even though the parent <div> element has another setting.
…px
height=30px|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
…em
height=3.0em|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
…%
height=300%|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
(number)
height=3|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
tag
blockquote
tag=blockquote|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
div
tag=div|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
p
tag=p|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}

At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]

Incorrect use

Parameter Value What you type What you see Comments
(none)
Control sample
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]
height
Invalid line
height values
height=fooheight|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] Output with standard line height.
tag
Invalid HTML
tags
tag=footag|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] Output in <span> tags.

See also