HTML CSS Reference/CSS Attributes and Javascript Style Properties
- important
- ScrollBarColorProperties
- accelerator
- active
- background
- background attachment
- background color
- background image
- background position
- background position x
- background position y
- background repeat
- behavior
- border
- border bottom
- border bottom color
- border bottom style
- border bottom width
- border collapse
- border color
- border left
- border left color
- border left style
- border left width
- border right
- border right color
- border right style
- border right width
- border style
- border top
- border top color
- border top style
- border top width
- border width
- bottom
- charset
- clear
- clip
- color
- cursor
- direction
- display
- filter
- first letter
- first line
- float
- hasLayout
- height
- hover
- ime mode
- import
- layout flow
- layout grid
- layout grid char
- layout grid line
- layout grid mode
- layout grid type
- left
- letter spacing
- line break
- line height
- link
- list style
- list style image
- list style position
- list style type
- margin
- margin bottom
- margin left
- margin right
- margin top
- media
- min height
- overflow
- overflow x
- overflow y
- padding
- padding bottom
- padding left
- padding right
- padding top
- page
- page break after
- page break before
- page break inside
- pixelBottom
- pixelHeight
- pixelLeft
- pixelRight
- pixelTop
- pixelWidth
- posBottom
- posHeight
- posLeft
- posRight
- posTop
- posWidth
- position
- right
- ruby align
- ruby overhang
- ruby position
- styleFloat
- table layout
- text align
- text align last
- text autospace
- text decoration
- text indent
- text justify
- text kashida space
- text overflow
- text transform
- text underline position
- textDecorationLineThrough
- textDecorationNone
- textDecorationOverline
- textDecorationUnderline
- top
- unicode bidi
- vertical align
- visibility
- visited
- white space
- width
- word break
- word spacing
- word wrap
- writing mode
- z index
- zoom
Содержание
- 1 "font" Example
- 2 "font-face" Example
- 3 "font-face" Syntax and Note
- 4 "font-family" Example
- 5 "font-family" is applied to
- 6 "font-family" Possible Values
- 7 "font-family" Syntax and Note
- 8 "font" is applied to
- 9 "font" Possible Values
- 10 "font-size" Example
- 11 "font-size" is applied to
- 12 "font-size" Possible Values
- 13 "font-size" Syntax and Note
- 14 "font-style" Example
- 15 "font-style" is applied to
- 16 "font-style" Possible Values
- 17 "font-style" Syntax and Note
- 18 "font" Syntax and Note
- 19 "font-variant" Example
- 20 "font-variant" is applied to
- 21 "font-variant" Possible Values
- 22 "font-variant" Syntax and Note
- 23 "font-weight" Example
- 24 "font-weight" is applied to
- 25 "font-weight" Syntax and Note
"font" Example
<html>
<body>
<div style="font:italic normal bolder 12pt verdana">
font font</div>
<hr>
<div style="padding:10px;"
onmouseover="this.style.font="italic small-caps bold 12pt serif""
onmouseout="this.style.font="normal normal normal normal medium times new roman"">
Move the mouse over and out to change the font style.
</div>
</body>
</html>
"font-face" Example
<head>
<style type="text/css">
@font-face { font-family: Lucida;
font-style: normal;
font-weight: normal;
src: url("fontFile.eot")
}
</style>
</head>
<body>
<p style="font-family: Lucida"> Paragraph text </p>
</body>
</html>
"font-face" Syntax and Note
Note:
Set a downloadable font.
"font-family" Example
<html>
<body>
<div onmouseover="this.style.fontFamily="arial""
onmouseout="this.style.fontFamily="times"">
Move the mouse over and out to change the font-family value.
</div>
</body>
</html>
"font-family" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <basefont> |
| |<big> <blockquote> |
| |<body> <button> |
| |<caption> <center> |
| |<cite> <code> |
| |<col> <colgroup> |
| |currentStyle <custom> |
| |<dd> defaults |
| |<dfn> <dir> |
| |<div> <dl> |
| |<dt> <em> |
| |<fieldset> <form> |
| |<hn> <html> |
| |<i> <img> |
| |<input type="button"> <input type="checkbox"> |
| |<input type="file"> <input type="image"> |
| |<input type="password"> <input type="radio"> |
| |<inputtype="reset"> <input type="submit"> |
| |<input type="text"> <isindex> |
| |<kbd> <label> |
| |<legend> <li> |
| |<listing> <marquee> |
| |<menu> <ol> |
| |<p> <pre> |
| |runtimeStyle <s> |
| |<samp> <select> |
| |<small> <span> |
| |<strike> <strong> |
| |style <sub> |
| |<sup> <table> |
| |<tbody> <td> |
| |<textarea> <tfoot> |
| |<th> <thead> |
| |<tr> <tt> |
| |<u> <ul> |
| |<var> <xmp> |
+----------------+--------------------------------------------------------------+
"font-family" Possible Values
Possible Values
Available font families supported by the browser"s operating system.
For example,
Times,
Helvetica,
Zapf-Chancery,
Western,
Courier,
serif,
sans-serif,
cursive,
fantasy,
ormonospace.
"font-family" Syntax and Note
Note:
Set font family.
Syntax:
element { font-family: value }
elementID.style.fontFamily = "value"
document.all.elementID.style.fontFamily = "value" // IE only
"font" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <big> |
| |<blockquote> <body> |
| |<button> <caption> |
| |<center> <cite> |
| |<code> <col> |
| |<colgroup> <custom> |
| |<dd> defaults |
| |<dfn> <dir> |
| |<div> <dl> |
| |<dt> <em> |
| |<fieldset> <form> |
| |<hn> <html> |
| |<i> <img> |
| |<inputtype="button"> <input type="checkbox"> |
| |<input type="file"> <input type="image"> |
| |<input type="password"> <input type="radio"> |
| |<input type="reset"> <inputtype="submit"> |
| |<input type="text"> <isindex> |
| |<kbd> <label> |
| |<legend> <li> |
| |<listing> <marquee> |
| |<menu> <nobr> |
| |<ol> <p> |
| |<pre> runtimeStyle |
| |<s> <samp> |
| |<select> <small> |
| |<span> <strike> |
| |<strong> style |
| |<sub> <sup> |
| |<table> <tbody> |
| |<td> <textarea> |
| |<tfoot> <th> |
| |<thead> <tr> |
| |<tt> <u> |
| |<ul> <var> |
| |<xmp> |
+----------------+--------------------------------------------------------------+
"font" Possible Values
Possible Values
CSS font constants:
caption font used for captioned controls (buttons, drop-downs, and so on)
icon font used to label icons
menu font for menus and drop-down lists
message-box font for dialog boxes
small-caption font for labeling small controls
status-bar font in the window status bars
"font-size" Example
<html>
<body>
<p style="font-size:14pt">text.</p>
<hr>
<div style="padding:10px;"
onmouseover="this.style.fontSize="16pt""
onmouseout="this.style.fontSize="12pt"">
Move the mouse pointer to change the font-size value.</div>
</body>
</html>
"font-size" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <basefont> |
| |<big> <blockquote> |
| |<body> <button> |
| |<caption> <center> |
| |<cite> <code> |
| |<col> <colgroup> |
| |currentStyle <custom> |
| |<dd> defaults |
| |<dfn> <dir> |
| |<div> <dl> |
| |<dt> <em> |
| |<fieldset> <form> |
| |<hn> <html> |
| |<i> <img> |
| |<input type="button"> <input type="checkbox"> |
| |<input type="file"> <input type="image"> |
| |<input type="password"> <input type="radio"> |
| |<inputtype="reset"> <input type="submit"> |
| |<input type="text"> <isindex> |
| |<kbd> <label> |
| |<legend> <li> |
| |<listing> <marquee> |
| |<menu> <ol> |
| |<p> <pre> |
| |runtimeStyle <s> |
| |<samp> <select> |
| |<small> <span> |
| |<strike> <strong> |
| |style <sub> |
| |<sup> <table> |
| |<tbody> <td> |
| |<textarea> <tfoot> |
| |<th> <thead> |
| |<tr> <tt> |
| |<u> <ul> |
| |<var> <xmp> |
+----------------+--------------------------------------------------------------+
"font-size" Possible Values
Possible Values
absolute Any of the following values:
xx-small,
x-small,
small,
medium,
large,
x-large,
xx-large
relative The font size is relative to the parent element"s font size,values
are either larger or smaller
length A floating point number followed by a unit designator
percentage specifies the size relativeto the parent element"s font size
"font-size" Syntax and Note
Note:
Set the font size.
Syntax:
element { font-size: value }
elementID.style.fontSize = "value"
document.all.elementID.style.fontSize = "value" // IE only
"font-style" Example
<html>
<body>
<div onmouseover="this.style.fontStyle="italic""
onmouseout="this.style.fontStyle="normal"">
Move the mouse pointer to change the font style value.
</div>
</body>
</html>
"font-style" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <basefont> |
| |<big> <blockquote> |
| |<body> <button> |
| |<caption> <center> |
| |<cite> <code> |
| |<col> <colgroup> |
| |currentStyle <custom> |
| |<dd> defaults |
| |<dfn> <dir> |
| |<div> <dl> |
| |<dt> <em> |
| |<fieldset> <form> |
| |<hn> <html> |
| |<i> <img> |
| |<input type="button"> <input type="checkbox"> |
| |<input type="file"> <input type="image"> |
| |<input type="password"> <input type="radio"> |
| |<inputtype="reset"> <input type="submit"> |
| |<input type="text"> <isindex> |
| |<kbd> <label> |
| |<legend> <li> |
| |<listing> <marquee> |
| |<menu> <ol> |
| |<p> <pre> |
| |runtimeStyle <s> |
| |<samp> <select> |
| |<small> <span> |
| |<strike> <strong> |
| |style <sub> |
| |<sup> <table> |
| |<tbody> <td> |
| |<textarea> <tfoot> |
| |<th> <thead> |
| |<tr> <tt> |
| |<u> <ul> |
| |<var> <xmp> |
+----------------+--------------------------------------------------------------+
"font-style" Possible Values
Possible Values
normal the default
italic, IE only
oblique IE only
"font-style" Syntax and Note
Note:
the font style.
Syntax:
element { font-style: value }
elementID.style.fontStyle = "value"
document.all.elementID.style.fontStyle = "value" // IE only
"font" Syntax and Note
Note:
Set the font style properties: font-family,
font-style,
font-size,
font-variant,
font-weight,
line-height.
Syntax:
element { font: values }
elementID.style.font = "value"
document.all.elementID.style.font = "values" // IE only
"font-variant" Example
<html>
<body>
<div font-size:16pt"
onmouseover="this.style.fontVariant="small-caps""
onmouseout="this.style.fontVariant="normal"">
Move the mouse to change the font-variant value.
</div>
</body>
<html>
"font-variant" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <big> |
| |<blockquote> <body> |
| |<button> <caption> |
| |<center> <cite> |
| |<code> <col> |
| |<colgroup> currentStyle |
| |<custom> <dd> |
| |defaults <dfn> |
| |<dir> <div> |
| |<dl> <dt> |
| |<em> <fieldset> |
| |<form> <hn> |
| |<html> <i> |
| |<img> <input type="button"> |
| |<input type="checkbox"> <input type="file"> |
| |<inputtype="image"> <input type="password"> |
| |<input type="radio"> <input type="reset"> |
| |<input type="submit"> <input type="text"> |
| |<isindex> <kbd> |
| |<label> <legend> |
| |<li> <listing> |
| |<marquee> <menu> |
| |<ol> <p> |
| |<pre> runtimeStyle |
| |<s> <samp> |
| |<small> <span> |
| |<strike> <strong> |
| |style <sub> |
| |<sup> <table> |
| |<tbody> <td> |
| |<textarea> <tfoot> |
| |<th> <thead> |
| |<tr> <tt> |
| |<u> <ul> |
| |<var> <xmp> |
+----------------+--------------------------------------------------------------+
"font-variant" Possible Values
Possible Values
normal
small-caps.
"font-variant" Syntax and Note
Note:
Whether to render in small capital letters for lowercase characters.
Syntax:
element { font-variant: value }
elementID.style.fontVariant = "value"
document.all.elementID.style.fontVariant = "value" // IE only
"font-weight" Example
<html>
<body>
<div style="font-size:16pt "
onmouseover="this.style.fontWeight="bold""
onmouseout="this.style.fontWeight="normal"">
Move the mouse to change the font-weight value.</div>
</body>
</html>
"font-weight" is applied to
+----------------+--------------------------------------------------------------+
| Applied_To |<a> <address> |
| |<b> <big> |
| |<blockquote> <body> |
| |<button> <caption> |
| |<center> <cite> |
| |<code> <col> |
| |<colgroup> currentStyle |
| |<custom> <dd> |
| |defaults <dfn> |
| |<dir> <div> |
| |<dl> <dt> |
| |<em> <fieldset> |
| |<form> <hn> |
| |<html> <i> |
| |<img> <input type="button"> |
| |<input type="checkbox"> <input type="file"> |
| |<inputtype="image"> <input type="password"> |
| |<input type="radio"> <input type="reset"> |
| |<input type="submit"> <input type="text"> |
| |<isindex> <kbd> |
| |<label> <legend> |
| |<li> <listing> |
| |<marquee> <menu> |
| |<ol> <p> |
| |<pre> runtimeStyle |
| |<s> <samp> |
| |<small> <span> |
| |<strike> <strong> |
| |style <sub> |
| |<sup> <table> |
| |<tbody> <td> |
| |<textarea> <tfoot> |
| |<th> <thead> |
| |<tr> <tt> |
| |<u> <ul> |
| |<var> <xmp> |
+----------------+--------------------------------------------------------------+
"font-weight" Syntax and Note
Note:
boldness or lightness of the font.
Syntax:
element { font-weight: value }
elementID.style.fontWeight = "value"
document.all.elementID.style.fontWeight = "value" // IE onlyRelative values:normal (the default)bold,bolderlighter.Constant values:100,200,300 (lighter than normal),400 (normal),500,600 (bolder than normal),700 (bold),800,900 (even bolder).