The DOM Style orphans property controls the minimum number of lines in a paragraph split on the old page. The default value for orphans is inherited or 2(which means a minimum of 2 lines will be left on the page if a paragraph is going to get split).
The DOM Style orphans property controls the minimum number of lines in a paragraph split on the old page. The default value for orphans is inherited or 2(which means a minimum of 2 lines will be left on the page if a paragraph is going to get split).
Syntax:
object.style.orphans
object.style.orphans = "number|initial|inherit"
Property Values:
- Number: An integer which specifies the number of lines that can be left at the end of a page or column. Negative values are not allowed.Default value is 2.
- Initial: Sets the element to its initial value.
- Inherit: The Element inherits its orphans property from parent element.
Example-1: Set number of liones for orphans property.
<!DOCTYPE html> < html >
< head >
< title >
HTML | DOM Style orphans Property
</ title >
< div id = "element" >
< p >
Cascading Style Sheets (CSS) is a style
sheet language used for describing the
presentation of a document written in a
markup language like HTML.[1] CSS is a
cornerstone technology of the World Wide
Web, alongside HTML and JavaScript.
</ p >
< p >
< span style = "color: red; font-weight: bold" >
CSS is designed to enable the separation
of presentation and content, including
layout,colors, and fonts.CSS has a simple
syntax and uses a number of English keywords
to specify the names of various style
properties.A style sheet consists of a list
of rules. Each rule or rule-set consists of
one or more selectors,and a declaration block.
</ span >
</ p >
< p >
This separation can improve content accessibility,
provide more flexibility and control in the
specification of presentation characteristics,
enable multiple web pages to share formatting
by specifying the relevant CSS in a separate .css
file, and reduce complexity and repetition in
the structural content.
</ p >
< p >
Separation of formatting and content also makes
it feasible to present the same markup page in
different styles for different rendering methods,
such as on-screen, in print, by voice
(via speech-based browser or screen reader),
and on Braille-based tactile devices. CSS also
has rules for alternate formatting if the content
is accessed on a mobile device.
</ p >
< p >
The name cascading comes from the specified
priority scheme to determine which style rule
applies if more than one rule matches a particular
element. This cascading priority scheme is predictable.
</ p >
</ div >
< style >
#element {
columns: 12em 3;
column-gap: 3em;
}
</ style >
< script >
function myFunction() {
// Number of lines that can be left at the end
// of a page or column.
document.getElementById("element").style.orphans =
"5";
}
myFunction()
</ script >
</ head >
</ html >
|
Output : As per orphans property, minimum of 5 lines will be left on the page or column(as we set orphans property “5” in the code) if a paragraph is going to split.
Supported Browsers: The browser supported by HTML | DOM Style orphans Property are listed below:
- Google Chrome 25+
- Internet Explorer 8+
- Opera 9.2+