CSS - line-break Property
The property line-break is useful in determining how to break lines in a block of text. This is essential as it makes the page more legible and readable.
Possible Values
auto: Default line break rule applied.
loose: Least restrictive line break rule applied.
normal: Most common line break rule applied.
strict: Most stringent line break rule applied.
anywhere: Allows the browser to apply line break rule anywhere, at any character.
initial: Set the initial value.
inherit: Inherits the value of the parent element.
Applies to
All the HTML elements.
DOM Syntax
object.style.lineBreak = "strict";
Example
Here is an example:
<html>
<head>
<style>
p {
border: 2px solid blue;
width: 200px;
}
.normal {
line-break: normal;
}
.loose {
line-break: loose;
}
.strict {
line-break: strict;
}
.auto {
line-break: auto;
}
.anywhere {
line-break: anywhere;
}
</style>
</head>
<body>
<h2>Line Break</h2>
<p class="normal">Normal - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text.</p>
<p class="loose">Loose - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
<p class="strict">Strict - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
<p class="auto">Auto - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
<p class="anywhere">Anywhere - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
</body>
</html>
Advertisements