hyphens

Ви читаєте англійську версію цього вмісту, бо ще не існує перекладу для цієї мови. Допоможіть нам перекласти цю статтю!

The hyphens CSS property specifies how words should be hyphenated when text wraps across multiple lines. It can prevent hyphenation entirely, hyphenate at manually-specified points within the text, or let the browser automatically insert hyphens where appropriate.

Hyphenation rules are language-specific. In HTML, the language is determined by the lang attribute, and browsers will hyphenate only if this attribute is present and the appropriate hyphenation dictionary is available. In XML, the xml:lang attribute must be used.

Note: The rules defining how hyphenation is performed are not explicitly defined by the specification, so the exact hyphenation may vary from browser to browser.

Syntax

/* Keyword values */
hyphens: none;
hyphens: manual;
hyphens: auto;

/* Global values */
hyphens: inherit;
hyphens: initial;
hyphens: unset;

The hyphens property is specified as a single keyword value chosen from the list below.

Values

none
Words are not broken at line breaks, even if characters inside the words suggest line break points. Lines will only wrap at whitespace.
manual
Words are broken for line-wrapping only where characters inside the word suggest line break opportunities. See Suggesting line break opportunities below for details.
auto
The browser is free to automatically break words at appropriate hyphenation points, following whatever rules it chooses. However, suggested line break opportunities (see Suggesting line break opportunities below) will override automatic break point selection when present.

Note: The auto setting's behavior depends on the language being properly tagged to select the appropriate hyphenation rules. You must specify a language using the lang HTML attribute to guarantee that automatic hyphenation is applied in that language.

Formal syntax

none | manual | auto

Suggesting line break opportunities

There are two Unicode characters used to manually specify potential line break points within text:

U+2010 (HYPHEN)
The "hard" hyphen character indicates a visible line break opportunity. Even if the line is not actually broken at that point, the hyphen is still rendered.
U+00AD (SHY)
An invisible, "soft" hyphen. This character is not rendered visibly; instead, it marks a place where the browser should break the word if hyphenation is necessary. In HTML, use ­ to insert a soft hyphen.

When the HTML <wbr> element leads to a line break, no hyphen is added.

Example

This example uses three classes, one for each possible configuration of the hyphens property.

HTML

<dl>
  <dt><code>none</code>: no hyphen; overflow if needed</dt>
  <dd lang="en" class="none">An extreme&shy;ly long English word</dd>
  <dt><code>manual</code>: hyphen only at &amp;hyphen; or &amp;&shy; (if needed)</dt>
  <dd lang="en" class="manual">An extreme&shy;ly long English word</dd>
  <dt><code>auto</code>: hyphens where the algorithm decides (if needed)</dt>
  <dd lang="en" class="auto">An extreme&shy;ly long English word</dd>
</dl>

CSS

dd { 
  width: 55px;
  border: 1px solid black;
 }
dd.none {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
dd.manual {
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  hyphens: manual;
}
dd.auto {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

Result

Specifications

Specification Status Comment
CSS Text Module Level 3
The definition of 'hyphens' in that specification.
Working Draft Initial definition
Initial valuemanual
Applies toall elements
Inheritedyes
Mediavisual
Computed valueas specified
Animation typediscrete
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
hyphensChrome Partial support 55
Notes
Partial support 55
Notes
Notes auto value is only supported on macOS and Android and for languages the OS provides hyphenation for.
Full support 13
Prefixed Notes
Prefixed Implemented with the vendor prefix: -webkit-
Notes Only -webkit-hyphens: none is supported.
Edge Partial support 12
Prefixed Notes
Partial support 12
Prefixed Notes
Prefixed Implemented with the vendor prefix: -ms-
Notes Only works if the specified language is the same as the language of the underlying OS.
Firefox Full support 43
Full support 43
Full support 6
Prefixed Notes
Prefixed Implemented with the vendor prefix: -moz-
Notes Automatic hyphenation only works for languages with hyphenation dictionaries that are integrated into Firefox.
IE Partial support 10
Prefixed Notes
Partial support 10
Prefixed Notes
Prefixed Implemented with the vendor prefix: -ms-
Notes Only works if the specified language is the same as the language of the underlying OS.
Opera Partial support 44
Notes
Partial support 44
Notes
Notes auto value is only supported on macOS and Android.
Safari Full support 5.1
Prefixed
Full support 5.1
Prefixed
Prefixed Implemented with the vendor prefix: -webkit-
WebView Android Full support 55
Full support 55
Full support 4
Prefixed
Prefixed Implemented with the vendor prefix: -webkit-
Chrome Android Full support 55
Full support 55
Full support 18
Prefixed
Prefixed Implemented with the vendor prefix: -webkit-
Firefox Android Full support 43
Full support 43
Full support 6
Prefixed Notes
Prefixed Implemented with the vendor prefix: -moz-
Notes Automatic hyphenation only works for languages with hyphenation dictionaries that are integrated into Firefox.
Opera Android Full support 43Safari iOS Full support 4.2
Prefixed
Full support 4.2
Prefixed
Prefixed Implemented with the vendor prefix: -webkit-
Samsung Internet Android Full support 6.0
Hyphenation dictionary for Afrikaans (af, af-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Bosnian, Serbian, and Serbo-Croatian (sh, sh-*, sr, sr-*, bs, bs-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Bulgarian (bg, bg-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Catalan (ca, ca-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Croatian (hr, hr-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Czech (cs, cs-*)Chrome No support NoEdge No support NoFirefox No support NoIE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android No support NoOpera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Danish (da, da-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Dutch (nl, nl-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for English (en, en-*)Chrome Full support 55Edge Full support 12Firefox Full support 6
Notes
Full support 6
Notes
Notes For English, Firefox uses an en-US dictionary
IE Full support 10Opera Full support 44Safari Full support 5.1
Notes
Full support 5.1
Notes
Notes For English, Safari uses different en-GB and en-US dictionaries.
WebView Android Full support 55Chrome Android Full support 55Firefox Android Full support 6
Notes
Full support 6
Notes
Notes For English, Firefox uses an en-US dictionary
Opera Android Full support 43Safari iOS Full support 6
Notes
Full support 6
Notes
Notes For English, Safari uses different en-GB and en-US dictionaries.
Samsung Internet Android Full support 6.0
Hyphenation dictionary for Esperanto (eo, eo-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Estonian (et, et-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Finnish (fi, fi-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for French (fr, fr-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Galician (gl, gl-*)Chrome No support NoEdge No support NoFirefox Full support 9IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 9Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for German, Reformed Orthography of 1996 (de, de-1996, de-DE, de-AT, de-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for German, Swiss Orthography (de-CH, de-CH-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for German, Traditional Orthography of 1901 (de-1901, de-AT-1901, de-DE-1901)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Hungarian (hu, hu-*)Chrome No support NoEdge No support NoFirefox Full support 9IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 9Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Icelandic (is, is-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Interlingua (ia, ia-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Italian (it, it-*)Chrome No support NoEdge No support NoFirefox Full support 9IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 9Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Kurmanji (kmr, kmr-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Latin (la, la-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Lithuanian (lt, lt-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Mongolian (mn, mn-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Norwegian (Nynorsk) (nn, nn-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Norwegian (Bokmål) (no, no-*, nb, nb-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera ? Safari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android ? Safari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Polish (pl, pl-*)Chrome No support NoEdge No support NoFirefox Full support 31IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Portuguese (pt, pt-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Brazilian Portuguese (pt-BR)Chrome No support NoEdge No support NoFirefox Full support 8
Notes
Full support 8
Notes
Notes For Brazilian Portuguese, Firefox uses a Portuguese dictionary.
IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8
Notes
Full support 8
Notes
Notes For Brazilian Portuguese, Firefox uses a Portuguese dictionary.
Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Russian (ru, ru-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Slovenian (sl, sl-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Spanish (es, es-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Swedish (sv, sv-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Turkish (tr, tr-*)Chrome No support NoEdge No support NoFirefox Full support 9IE No support NoOpera No support NoSafari Full support 5.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 9Opera Android No support NoSafari iOS Full support 5Samsung Internet Android No support No
Hyphenation dictionary for Ukrainian (uk, uk-*)Chrome No support NoEdge No support NoFirefox Full support 9IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support NoChrome Android No support NoFirefox Android Full support 9Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No
Hyphenation dictionary for Upper Sorbian (hsb, hsb-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
Hyphenation dictionary for Welsh (cy, cy-*)Chrome No support NoEdge No support NoFirefox Full support 8IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android Full support 8Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No

Legend

Full support  
Full support
Partial support  
Partial support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also