CSS Property: font
[this page | pdf | back links]
The CSS (CSS1) font property is a shorthand
property for setting the font properties of an element.
Valid property values
(other than inherit
and initial) are
defined by the elements of the shorthand. Shorthand elements (in the order in
which they appear):
-
font-style
-
font-variant
-
font-weight
-
font-size
i.e. line height (required)
-
font-family
(required)
|
Default Value:
|
See individual
properties
|
|
JavaScript syntax:
|
e.g. object.style.font="italic 12px arial"
|
|
Inherited:
|
Yes
|
|
Animatable:
|
See individual
properties
|
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head>
<style>
p {border: 1px solid green; width: 100px;}
p.x1 {font: italic bold 10px/25px Georgia,serif;}
</style>
</head>
<body>
Element with default property<br>
<p>Default text</p>
Property set using in-file HTML style
<p class="x1">italic bold 16px/30px Georgia,serif</p>
Property set using JavaScript
<p id="x2">italic bold 16px/30px Georgia,serif</p>
<script>
document.getElementById("x2").style.font =
"italic bold 10px/25px Georgia,serif"
</script>
</body>
</html>
|
FUNCTION THAT MAY ASSIST IN TESTING WHETHER FEATURE IS SUPPORTED:
function isSupportedCSSPropertyFont() {
var x = document.createElement("DIV"); x.style.font = "italic bold 10px/25px Georgia,serif"; return (window.getComputedStyle(x, null).font == "italic bold 10px/25px Georgia,serif");
} |
NAVIGATION LINKS
Contents | Prev | Next | CSS Properties