HTML DOM Style 对象
2008-04-11 14:07
435 查看
body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
background: #f9f9f9 url(/i/site_holder.gif) top center repeat-y;
font: 12px Verdana, Arial, Helvetica, sans-serif;
}
div#wrapper {
margin: 0 auto;
padding: 0;
border: 0;
width: 966px;
text-align: left;
background: transparent url(/i/site_wrapper.gif) top left repeat-y;
}
div#header {
margin: 0 0 0 12px;
padding: 0;
border: 0;
width: 937px;
height: 60px;
background: #c3c3c3;
}
div#navsecond {
float: left;
margin: 0 0 0 6px;
padding: 0;
border: 0;
width: 150px;
background : transparent;
}
html>body div#navsecond {
margin-left: 12px;
}
div#maincontent {
text-align: left;
margin: 0;
padding: 0;
border: 0;
width: 637px;
background: transparent;
}
div#sidebar {
float: left;
margin: 0;
padding: 0;
border: 0;
width: 150px;
background: transparent;
}
div#footer {
clear: both;
margin: 0;
padding: 0;
margin-left: 12px;
width: 937px;
height: 46px;
background: #b6b6b6;
border-top: 10px solid #fff;
border-bottom: 10px solid #fff;
}
div#footer p {
margin: 2px 10px 0 10px;
font-size: 12px;
}
div#header a {
text-indent: -9999px;
margin: 0;
padding: 0;
border: 0;
overflow:hidden;
}
div#header a:link, div#header a:visited {
display: block;
width: 937px;
height: 60px;
background : transparent url(/i/site_header01.gif) top left no-repeat;
margin: 0;
padding: 0;
border: 0;
}
div#header a:hover {
background: #cacaca url(/i/site_header02.gif) top left no-repeat;
}
div#navfirst {
height: 40px;
width: 937px;
margin: 0 0 0 12px;
padding: 0;
border: 0;
background: #fff;
}
div#navfirst ul#menu {
height: 40px;
width: 937px;
background: transparent url(/i/site_nav.gif) top left no-repeat;
margin: 0;
padding: 0;
position: relative;
}
div#navfirst ul#menu li {
margin:0;
padding:0;
list-style:none;
position:absolute;
top:0;
}
ul#menu li,ul#menu a {
display: block;
height: 40px;
}
div#navfirst ul#menu li a {
text-indent: -9999px;
overflow:hidden;
text-decoration: none;
}
#h {left:0;width:88px;}
#x {left:88px;width:86px;}
#b {left:174px;width:189px;}
#s {left:363px;width:177px;}
#d {left:540px;width:120px;}
#m {left:660px;width:134px;}
#w {left:794px;width:143px;}
#h a:hover {background: transparent url(/i/site_nav.gif) 0 -40px no-repeat;}
#x a:hover {background: transparent url(/i/site_nav.gif) -88px -40px no-repeat;}
#b a:hover {background: transparent url(/i/site_nav.gif) -174px -40px no-repeat;}
#s a:hover {background: transparent url(/i/site_nav.gif) -363px -40px no-repeat;}
#d a:hover {background: transparent url(/i/site_nav.gif) -540px -40px no-repeat;}
#m a:hover {background: transparent url(/i/site_nav.gif) -660px -40px no-repeat;}
#w a:hover {background: transparent url(/i/site_nav.gif) -794px -40px no-repeat;}
body.html #h {background: transparent url(/i/site_nav.gif) 0 -40px no-repeat;}
body.xml #x {background: transparent url(/i/site_nav.gif) -88px -40px no-repeat;}
body.browserscripting #b {background: transparent url(/i/site_nav.gif) -174px -40px no-repeat;}
body.serverscripting #s {background: transparent url(/i/site_nav.gif) -363px -40px no-repeat;}
body.dotnet #d {background: transparent url(/i/site_nav.gif) -540px -40px no-repeat;}
body.multimedia #m {background: transparent url(/i/site_nav.gif) -660px -40px no-repeat;}
body.webbuilding #w {background: transparent url(/i/site_nav.gif) -794px -40px no-repeat;}
/* Default links */
a:link, a:visited {
text-decoration : underline;
color : #900b09;
background : transparent;
}
a:hover {
text-decoration : underline;
color: #ff0000;
background : transparent;
}
a:active {
text-decoration : underline;
color : #ff0000;
background : transparent;
}
div#navsecond a:link, div#navsecond a:visited {
text-decoration : none;
color:#000;
background : transparent;
}
div#navsecond a:hover {
text-decoration : underline;
color : #000;
background : transparent;
}
div#navsecond a:active {
text-decoration : underline;
color : #000;
background : transparent;
}
h2, h3, h4, h5, h6 {
font-weight: bold;
margin:0;
padding:0;
}
div#maincontent h1 {
margin:15px 0 0 15px;
font-size: 20px;
font-family: '微软雅黑', Verdana, Arial, Helvetica, sans-serif;
}
div#maincontent h2 {
font-size: 14px;
}
div#maincontent h3, div#maincontent h4{
margin:20px 0 0 0;
font-size:12px;
}
body#homesecond div#navsecond li {
margin:5px 0 0 0;
font-weight:bold;
font-size:12px;
}
div#w3 h2 {
margin:0;
}
div.idea h3 {
margin-top:15px;
}
div#navsecond h2, div#sidebar h2 {
font-size: 12px;
margin:10px 0 0 12px;
}
p {
margin: 12px 0 0 0;
line-height: 150%;
}
div#w3school p {
margin-left:15px;
}
div#intro strong {
font-size:12px;
}
div#maincontent div#intro img {
float:left;
margin:0 30px 0 0;
padding:0;
}
p.note span {
font-weight:bold;
}
p.important span {
font-weight:bold;
color:#dd0000;
}
p.tip span {
font-weight:bold;
color:#ff9955;
}
p.inherited {
font-weight:bold;
color:#ff0000;
}
p.inherited span {
font-weight:bold;
color:#999;
}
em {
font-style:normal;
font-weight:bold;
}
pre {
width:580px;
margin: 10px 0 0 0;
padding: 10px;
border: 0;
border: 1px dotted #785;
background: #f5f5f5;
font-family: "Courier New",monospace;
font-size: 12px;
}
pre code {
font-family: "Courier New",monospace;
color:#0000ff;
}
pre span {
color:#999;
}
.tabledata table pre {
width:auto;
margin:0;
padding:0;
border:0;
background-color:transparent;
}
div#maincontent ul {
margin-top:10px;
margin-bottom:0;
}
div#maincontent li {
margin-top:3px;
}
div#navsecond ul, div#navsecond li, div#sidebar ul, div#sidebar li {
margin: 0;
padding: 0;
}
div#navsecond ul, div#sidebar ul {
margin-left: 12px;
}
div#navsecond li, div#sidebar li {
list-style: none;
}
div#navsecond li.list_apart {
margin-top:10px;
}
ul.small {
font-size:11px;
}
img {
border:0;
}
div#maincontent img {
margin:10px 0 0 0;
}
img.illustration {
margin:15px 0 0 5px;
}
body#homefirst img{
float:left;
}
div#maincontent div{
width: 607px;
margin: 0 0 0 15px;
padding: 20px 0 20px 0;
border:0;
border-top: 1px solid #aaa;
border-bottom: 1px solid #aaa;
}
div#w3 {
text-align:center;
}
body#homefirst div#maincontent div.idea {
padding: 0;
min-height: 118px;
}
body#homesecond dl {
margin:0;
padding:0;
}
body#homesecond dt {
font-weight: bold;
font-size: 14px;
margin:0;
padding:0;
}
body#homesecond dd {
color:#000088;
margin:10px 0 0 0;
padding:0;
}
body#homesecond dd p {
margin:0;
padding:0;
}
div#definition dl {
margin: 0;
padding:0;
}
div#definition dt {
font-weight: bold;
font-size: 14px;
}
div#definition dd {
margin:0;
color:#000088;
}
div#maincontent div#toc div {
margin:0;
margin-top:15px;
margin-bottom:35px;
padding:0;
border:0;
}
div#toc img {
float:left;
margin-right:10px;
}
div#toc div dt, div#toc div dl {
margin-top:0;
}
div#example dl, div.example dl, div#moreexamples dl, div#toc dl, div#referencelist dl {
margin: 10px 0 0 0;
}
div#example dt, div.example dt, div#moreexamples dt, div#toc dt, div#referencelist dt {
margin:15px 0 5px 0;
}
div#example dd, div.example dd, div#moreexamples dd, div#toc dd, div#referencelist dd {
margin:0;
}
div#definitionlist dl, dl.define {
margin: 10px 0 0 0;
}
div#definitionlist dt, dl.define dt {
margin:15px 0 3px 0;
font-weight:bold;
}
div#definitionlist dd, dl.define dd {
margin:0;
color:#000088;
}
div#maincontent input, div#maincontent select, {
font-family:"Courier New", Courier, monospace;
font-size:12px;
}
div.tabledata table {
margin-top:10px;
border-collapse:collapse;
border:1px solid #888;
}
div.tabledata th {
padding:5px 0 5px 0;
background-color:#ccc;
border:1px solid #888;
}
div.tabledata td {
vertical-align:text-top;
padding-top:4px;
background-color:#efefef;
border:1px solid #aaa;
}
div.tabledata ul, div.tabledata li {
list-style-type:none;
margin:0;
padding:0;
}
div.tabledata td em{
color:#ff0000;
font-weight:normal;
}
table.dataintable {
font-family:"Courier New", Courier, monospace;
font-size:12px;
margin-top:10px;
border-collapse:collapse;
border:1px solid #888;
width:100%;
}
table.dataintable pre {
width:auto;
margin:0;
padding:0;
border:0;
background-color:transparent;
}
table.dataintable th {
padding:5px 15px 5px 5px;
background-color:#ccc;
border:1px solid #888;
}
table.dataintable td {
vertical-align:text-top;
padding:5px 15px 5px 5px;
background-color:#efefef;
border:1px solid #aaa;
}
table.dataintable p {margin:0 0 2px 0;}
div#maincontent table.dataintable ul, div#maincontent table.dataintable li {
list-style-type:none;
margin:0;
padding:0;
}
table.dataintable td em{
color:#0000ff;
font-weight:normal;
}
table.dataintable .table_value {color:#0F93D2;}
.no_wrap {white-space:nowrap;}
div#maincontent table.dataintable ul.listintable {
margin:20px;
padding:0;
}
div#maincontent table.dataintable ul.listintable li{
list-style-type:disc;
}
#xhtmlreference table {
width:95%;
margin:15px 0 0 15px;
border-collapse:collapse;
border:1px solid #888;
}
#xhtmlreference table th {
padding:5px 15px 5px 5px;
background-color:#ccc;
border:1px solid #888;
}
#xhtmlreference table th.xhtml_tag {width:30%;}
#xhtmlreference table th.xhtml_description {width:50%;}
#xhtmlreference table th.xhtml_nn {width:5%;}
#xhtmlreference table th.xhtml_ie {width:5%;}
#xhtmlreference table th.xhtml_dtd {width:10%;}
#xhtmlreference table th.xhtml_sa {width:20%;}
#xhtmlreference table th.xhtml_sv {width:35%;}
#xhtmlreference table th.xhtml_sd {width:45%;}
#xhtmlreference table th.xhtml_ea {width:25%;}
#xhtmlreference table th.xhtml_ev {width:15%;}
#xhtmlreference table th.xhtml_ed {width:60%;}
#xhtmlreference table th.xhtml_message {width:40%;}
#xhtmlreference table th.xhtml_md {width:60%;}
#xhtmlreference table td {
vertical-align:text-top;
padding:5px 5px 5px 5px;
background-color:#efefef;
border:1px solid #aaa;
}
#xhtmlreference table p {
margin:0 0 2px 0;
}
#xhtmlreference table ul, #xhtmlreference table li {
list-style-type:none;
margin:0;
padding:0;
}
#xhtmlreference table a:link,#xhtmlreference table a:visited {color:#000099;}
#xhtmlreference table a:hover {color:#0066ff;}
#xhtmlreference table a:active {color:#0099ff;}
div#tpn, div#bpn {
height:21px;
width:230px;
margin: 0;
padding: 0;
border: 0;
background: #fff;
}
div#tpn ul.prenext, div#bpn ul.prenext {
height:21px;
width:230px;
background: transparent url(/i/site_prenext.gif) top left no-repeat;
margin:0;
padding:0;
border:0;
position:relative;
}
div#tpn ul.prenext li, div#bpn ul.prenext li {
margin:0;
padding:0;
list-style:none;
position:absolute;
top:0px;
overflow:hidden;
}
ul.prenext li, ul.prenext a {
display:block;
height:21px;
}
div#tpn ul.prenext a, div#bpn ul.prenext a {
text-indent: -9999px;
text-decoration: none;
}
.pre {left:0; width:105px;}
.next {left:125px; width:105px;}
.pre a:hover {background: transparent url(/i/site_prenext.gif) 0 -21px no-repeat;}
.next a:hover {background: transparent url(/i/site_prenext.gif) -125px -21px no-repeat;}
div#course {
background:transparent url(/i/site_course.gif) top left no-repeat;
padding:30px 0 10px 0;
}
div#selected {
background:transparent url(/i/site_selected.gif) top left no-repeat;
padding:30px 0 10px 0;
}
div#tools {
background:transparent url(/i/site_tools.gif) top left no-repeat;
padding:45px 0 5px 15px;
margin:0;
}
div#books {
background:transparent url(/i/site_books.gif) top left no-repeat;
padding:40px 0 10px 0;
}
div#tools h5 {
margin: 0 0 10px 0;
padding: 0;
overflow:hidden;
}
div#tools h5#tools_reference {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_reference a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_reference.gif) top left no-repeat;
}
div#tools h5#tools_reference a:hover {
background: transparent url(/i/site_reference.gif) 0 -45px no-repeat;
}
div#tools h5#tools_example {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_example a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_example.gif) top left no-repeat;
}
div#tools h5#tools_example a:hover {
background: transparent url(/i/site_example.gif) 0 -45px no-repeat;
}
div#tools h5#tools_quiz {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_quiz a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_quiz.gif) top left no-repeat;
}
div#tools h5#tools_quiz a:hover {
background: transparent url(/i/site_quiz.gif) 0 -45px no-repeat;
}
div#searchui {
margin:15px 0 15px 0;
padding:0;
}
div#searchui p {
margin:0;
padding:0;
}
#searchui label {
margin:0 0 0 2px;
text-transform:uppercase;
letter-spacing:2px;
font-size:11px;
}
#searchui input.button {
background:#AE4141;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
}
#searchui input.box {
margin:0 0 0 2px;
width:100px;
background:#f5f5f5;
font:12px Verdana, Arial, Helvetica, sans-serif;
}
Border and Margin
Layout
List
Misc
Positioning
Printing
Scrollbar
Table
Text
Standard
IE: Internet Explorer, M: 仅适用于Mac IE, W: 仅适用于Windows IE, F: Firefox, O: Opera
W3C: 万维网联盟 World Wide Web Consortium (Internet 标准).
margin: 0;
padding: 0;
border: 0;
text-align: center;
background: #f9f9f9 url(/i/site_holder.gif) top center repeat-y;
font: 12px Verdana, Arial, Helvetica, sans-serif;
}
div#wrapper {
margin: 0 auto;
padding: 0;
border: 0;
width: 966px;
text-align: left;
background: transparent url(/i/site_wrapper.gif) top left repeat-y;
}
div#header {
margin: 0 0 0 12px;
padding: 0;
border: 0;
width: 937px;
height: 60px;
background: #c3c3c3;
}
div#navsecond {
float: left;
margin: 0 0 0 6px;
padding: 0;
border: 0;
width: 150px;
background : transparent;
}
html>body div#navsecond {
margin-left: 12px;
}
div#maincontent {
text-align: left;
margin: 0;
padding: 0;
border: 0;
width: 637px;
background: transparent;
}
div#sidebar {
float: left;
margin: 0;
padding: 0;
border: 0;
width: 150px;
background: transparent;
}
div#footer {
clear: both;
margin: 0;
padding: 0;
margin-left: 12px;
width: 937px;
height: 46px;
background: #b6b6b6;
border-top: 10px solid #fff;
border-bottom: 10px solid #fff;
}
div#footer p {
margin: 2px 10px 0 10px;
font-size: 12px;
}
div#header a {
text-indent: -9999px;
margin: 0;
padding: 0;
border: 0;
overflow:hidden;
}
div#header a:link, div#header a:visited {
display: block;
width: 937px;
height: 60px;
background : transparent url(/i/site_header01.gif) top left no-repeat;
margin: 0;
padding: 0;
border: 0;
}
div#header a:hover {
background: #cacaca url(/i/site_header02.gif) top left no-repeat;
}
div#navfirst {
height: 40px;
width: 937px;
margin: 0 0 0 12px;
padding: 0;
border: 0;
background: #fff;
}
div#navfirst ul#menu {
height: 40px;
width: 937px;
background: transparent url(/i/site_nav.gif) top left no-repeat;
margin: 0;
padding: 0;
position: relative;
}
div#navfirst ul#menu li {
margin:0;
padding:0;
list-style:none;
position:absolute;
top:0;
}
ul#menu li,ul#menu a {
display: block;
height: 40px;
}
div#navfirst ul#menu li a {
text-indent: -9999px;
overflow:hidden;
text-decoration: none;
}
#h {left:0;width:88px;}
#x {left:88px;width:86px;}
#b {left:174px;width:189px;}
#s {left:363px;width:177px;}
#d {left:540px;width:120px;}
#m {left:660px;width:134px;}
#w {left:794px;width:143px;}
#h a:hover {background: transparent url(/i/site_nav.gif) 0 -40px no-repeat;}
#x a:hover {background: transparent url(/i/site_nav.gif) -88px -40px no-repeat;}
#b a:hover {background: transparent url(/i/site_nav.gif) -174px -40px no-repeat;}
#s a:hover {background: transparent url(/i/site_nav.gif) -363px -40px no-repeat;}
#d a:hover {background: transparent url(/i/site_nav.gif) -540px -40px no-repeat;}
#m a:hover {background: transparent url(/i/site_nav.gif) -660px -40px no-repeat;}
#w a:hover {background: transparent url(/i/site_nav.gif) -794px -40px no-repeat;}
body.html #h {background: transparent url(/i/site_nav.gif) 0 -40px no-repeat;}
body.xml #x {background: transparent url(/i/site_nav.gif) -88px -40px no-repeat;}
body.browserscripting #b {background: transparent url(/i/site_nav.gif) -174px -40px no-repeat;}
body.serverscripting #s {background: transparent url(/i/site_nav.gif) -363px -40px no-repeat;}
body.dotnet #d {background: transparent url(/i/site_nav.gif) -540px -40px no-repeat;}
body.multimedia #m {background: transparent url(/i/site_nav.gif) -660px -40px no-repeat;}
body.webbuilding #w {background: transparent url(/i/site_nav.gif) -794px -40px no-repeat;}
/* Default links */
a:link, a:visited {
text-decoration : underline;
color : #900b09;
background : transparent;
}
a:hover {
text-decoration : underline;
color: #ff0000;
background : transparent;
}
a:active {
text-decoration : underline;
color : #ff0000;
background : transparent;
}
div#navsecond a:link, div#navsecond a:visited {
text-decoration : none;
color:#000;
background : transparent;
}
div#navsecond a:hover {
text-decoration : underline;
color : #000;
background : transparent;
}
div#navsecond a:active {
text-decoration : underline;
color : #000;
background : transparent;
}
h2, h3, h4, h5, h6 {
font-weight: bold;
margin:0;
padding:0;
}
div#maincontent h1 {
margin:15px 0 0 15px;
font-size: 20px;
font-family: '微软雅黑', Verdana, Arial, Helvetica, sans-serif;
}
div#maincontent h2 {
font-size: 14px;
}
div#maincontent h3, div#maincontent h4{
margin:20px 0 0 0;
font-size:12px;
}
body#homesecond div#navsecond li {
margin:5px 0 0 0;
font-weight:bold;
font-size:12px;
}
div#w3 h2 {
margin:0;
}
div.idea h3 {
margin-top:15px;
}
div#navsecond h2, div#sidebar h2 {
font-size: 12px;
margin:10px 0 0 12px;
}
p {
margin: 12px 0 0 0;
line-height: 150%;
}
div#w3school p {
margin-left:15px;
}
div#intro strong {
font-size:12px;
}
div#maincontent div#intro img {
float:left;
margin:0 30px 0 0;
padding:0;
}
p.note span {
font-weight:bold;
}
p.important span {
font-weight:bold;
color:#dd0000;
}
p.tip span {
font-weight:bold;
color:#ff9955;
}
p.inherited {
font-weight:bold;
color:#ff0000;
}
p.inherited span {
font-weight:bold;
color:#999;
}
em {
font-style:normal;
font-weight:bold;
}
pre {
width:580px;
margin: 10px 0 0 0;
padding: 10px;
border: 0;
border: 1px dotted #785;
background: #f5f5f5;
font-family: "Courier New",monospace;
font-size: 12px;
}
pre code {
font-family: "Courier New",monospace;
color:#0000ff;
}
pre span {
color:#999;
}
.tabledata table pre {
width:auto;
margin:0;
padding:0;
border:0;
background-color:transparent;
}
div#maincontent ul {
margin-top:10px;
margin-bottom:0;
}
div#maincontent li {
margin-top:3px;
}
div#navsecond ul, div#navsecond li, div#sidebar ul, div#sidebar li {
margin: 0;
padding: 0;
}
div#navsecond ul, div#sidebar ul {
margin-left: 12px;
}
div#navsecond li, div#sidebar li {
list-style: none;
}
div#navsecond li.list_apart {
margin-top:10px;
}
ul.small {
font-size:11px;
}
img {
border:0;
}
div#maincontent img {
margin:10px 0 0 0;
}
img.illustration {
margin:15px 0 0 5px;
}
body#homefirst img{
float:left;
}
div#maincontent div{
width: 607px;
margin: 0 0 0 15px;
padding: 20px 0 20px 0;
border:0;
border-top: 1px solid #aaa;
border-bottom: 1px solid #aaa;
}
div#w3 {
text-align:center;
}
body#homefirst div#maincontent div.idea {
padding: 0;
min-height: 118px;
}
body#homesecond dl {
margin:0;
padding:0;
}
body#homesecond dt {
font-weight: bold;
font-size: 14px;
margin:0;
padding:0;
}
body#homesecond dd {
color:#000088;
margin:10px 0 0 0;
padding:0;
}
body#homesecond dd p {
margin:0;
padding:0;
}
div#definition dl {
margin: 0;
padding:0;
}
div#definition dt {
font-weight: bold;
font-size: 14px;
}
div#definition dd {
margin:0;
color:#000088;
}
div#maincontent div#toc div {
margin:0;
margin-top:15px;
margin-bottom:35px;
padding:0;
border:0;
}
div#toc img {
float:left;
margin-right:10px;
}
div#toc div dt, div#toc div dl {
margin-top:0;
}
div#example dl, div.example dl, div#moreexamples dl, div#toc dl, div#referencelist dl {
margin: 10px 0 0 0;
}
div#example dt, div.example dt, div#moreexamples dt, div#toc dt, div#referencelist dt {
margin:15px 0 5px 0;
}
div#example dd, div.example dd, div#moreexamples dd, div#toc dd, div#referencelist dd {
margin:0;
}
div#definitionlist dl, dl.define {
margin: 10px 0 0 0;
}
div#definitionlist dt, dl.define dt {
margin:15px 0 3px 0;
font-weight:bold;
}
div#definitionlist dd, dl.define dd {
margin:0;
color:#000088;
}
div#maincontent input, div#maincontent select, {
font-family:"Courier New", Courier, monospace;
font-size:12px;
}
div.tabledata table {
margin-top:10px;
border-collapse:collapse;
border:1px solid #888;
}
div.tabledata th {
padding:5px 0 5px 0;
background-color:#ccc;
border:1px solid #888;
}
div.tabledata td {
vertical-align:text-top;
padding-top:4px;
background-color:#efefef;
border:1px solid #aaa;
}
div.tabledata ul, div.tabledata li {
list-style-type:none;
margin:0;
padding:0;
}
div.tabledata td em{
color:#ff0000;
font-weight:normal;
}
table.dataintable {
font-family:"Courier New", Courier, monospace;
font-size:12px;
margin-top:10px;
border-collapse:collapse;
border:1px solid #888;
width:100%;
}
table.dataintable pre {
width:auto;
margin:0;
padding:0;
border:0;
background-color:transparent;
}
table.dataintable th {
padding:5px 15px 5px 5px;
background-color:#ccc;
border:1px solid #888;
}
table.dataintable td {
vertical-align:text-top;
padding:5px 15px 5px 5px;
background-color:#efefef;
border:1px solid #aaa;
}
table.dataintable p {margin:0 0 2px 0;}
div#maincontent table.dataintable ul, div#maincontent table.dataintable li {
list-style-type:none;
margin:0;
padding:0;
}
table.dataintable td em{
color:#0000ff;
font-weight:normal;
}
table.dataintable .table_value {color:#0F93D2;}
.no_wrap {white-space:nowrap;}
div#maincontent table.dataintable ul.listintable {
margin:20px;
padding:0;
}
div#maincontent table.dataintable ul.listintable li{
list-style-type:disc;
}
#xhtmlreference table {
width:95%;
margin:15px 0 0 15px;
border-collapse:collapse;
border:1px solid #888;
}
#xhtmlreference table th {
padding:5px 15px 5px 5px;
background-color:#ccc;
border:1px solid #888;
}
#xhtmlreference table th.xhtml_tag {width:30%;}
#xhtmlreference table th.xhtml_description {width:50%;}
#xhtmlreference table th.xhtml_nn {width:5%;}
#xhtmlreference table th.xhtml_ie {width:5%;}
#xhtmlreference table th.xhtml_dtd {width:10%;}
#xhtmlreference table th.xhtml_sa {width:20%;}
#xhtmlreference table th.xhtml_sv {width:35%;}
#xhtmlreference table th.xhtml_sd {width:45%;}
#xhtmlreference table th.xhtml_ea {width:25%;}
#xhtmlreference table th.xhtml_ev {width:15%;}
#xhtmlreference table th.xhtml_ed {width:60%;}
#xhtmlreference table th.xhtml_message {width:40%;}
#xhtmlreference table th.xhtml_md {width:60%;}
#xhtmlreference table td {
vertical-align:text-top;
padding:5px 5px 5px 5px;
background-color:#efefef;
border:1px solid #aaa;
}
#xhtmlreference table p {
margin:0 0 2px 0;
}
#xhtmlreference table ul, #xhtmlreference table li {
list-style-type:none;
margin:0;
padding:0;
}
#xhtmlreference table a:link,#xhtmlreference table a:visited {color:#000099;}
#xhtmlreference table a:hover {color:#0066ff;}
#xhtmlreference table a:active {color:#0099ff;}
div#tpn, div#bpn {
height:21px;
width:230px;
margin: 0;
padding: 0;
border: 0;
background: #fff;
}
div#tpn ul.prenext, div#bpn ul.prenext {
height:21px;
width:230px;
background: transparent url(/i/site_prenext.gif) top left no-repeat;
margin:0;
padding:0;
border:0;
position:relative;
}
div#tpn ul.prenext li, div#bpn ul.prenext li {
margin:0;
padding:0;
list-style:none;
position:absolute;
top:0px;
overflow:hidden;
}
ul.prenext li, ul.prenext a {
display:block;
height:21px;
}
div#tpn ul.prenext a, div#bpn ul.prenext a {
text-indent: -9999px;
text-decoration: none;
}
.pre {left:0; width:105px;}
.next {left:125px; width:105px;}
.pre a:hover {background: transparent url(/i/site_prenext.gif) 0 -21px no-repeat;}
.next a:hover {background: transparent url(/i/site_prenext.gif) -125px -21px no-repeat;}
div#course {
background:transparent url(/i/site_course.gif) top left no-repeat;
padding:30px 0 10px 0;
}
div#selected {
background:transparent url(/i/site_selected.gif) top left no-repeat;
padding:30px 0 10px 0;
}
div#tools {
background:transparent url(/i/site_tools.gif) top left no-repeat;
padding:45px 0 5px 15px;
margin:0;
}
div#books {
background:transparent url(/i/site_books.gif) top left no-repeat;
padding:40px 0 10px 0;
}
div#tools h5 {
margin: 0 0 10px 0;
padding: 0;
overflow:hidden;
}
div#tools h5#tools_reference {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_reference a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_reference.gif) top left no-repeat;
}
div#tools h5#tools_reference a:hover {
background: transparent url(/i/site_reference.gif) 0 -45px no-repeat;
}
div#tools h5#tools_example {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_example a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_example.gif) top left no-repeat;
}
div#tools h5#tools_example a:hover {
background: transparent url(/i/site_example.gif) 0 -45px no-repeat;
}
div#tools h5#tools_quiz {
text-indent: -9999px;
width: 120px;
height: 45px;
}
div#tools h5#tools_quiz a {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
text-decoration: none;
background: transparent url(/i/site_quiz.gif) top left no-repeat;
}
div#tools h5#tools_quiz a:hover {
background: transparent url(/i/site_quiz.gif) 0 -45px no-repeat;
}
div#searchui {
margin:15px 0 15px 0;
padding:0;
}
div#searchui p {
margin:0;
padding:0;
}
#searchui label {
margin:0 0 0 2px;
text-transform:uppercase;
letter-spacing:2px;
font-size:11px;
}
#searchui input.button {
background:#AE4141;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
}
#searchui input.box {
margin:0 0 0 2px;
width:100px;
background:#f5f5f5;
font:12px Verdana, Arial, Helvetica, sans-serif;
}
HTML DOM Style 对象
Style 对象
Style 对象代表一个单独的样式声明。可从应用样式的文档或元素访问Style 对象。使用Style 对象属性的语法:
document.getElementById("id").style.property="值"
Style 对象的属性:
BackgroundBorder and Margin
Layout
List
Misc
Positioning
Printing
Scrollbar
Table
Text
Standard
IE: Internet Explorer, M: 仅适用于Mac IE, W: 仅适用于Windows IE, F: Firefox, O: Opera
W3C: 万维网联盟 World Wide Web Consortium (Internet 标准).
Background 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
background | 在一行中设置所有的背景属性 | 4 | 1 | 9 | Yes |
backgroundAttachment | 设置背景图像是否固定或随页面滚动 | 4 | 1 | 9 | Yes |
backgroundColor | 设置元素的背景颜色 | 4 | 1 | 9 | Yes |
backgroundImage | 设置元素的背景图像 | 4 | 1 | 9 | Yes |
backgroundPosition | 设置背景图像的起始位置 | 4 | No | No | Yes |
backgroundPositionX | 设置backgroundPosition属性的X坐标 | 4 | No | No | No |
backgroundPositionY | 设置backgroundPosition属性的Y坐标 | 4 | No | No | No |
backgroundRepeat | 设置是否及如何重复背景图像 | 4 | 1 | 9 | Yes |
Border and Margin 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
border | 在一行设置四个边框的所有属性 | 4 | 1 | 9 | Yes |
borderBottom | 在一行设置底边框的所有属性 | 4 | 1 | 9 | Yes |
borderBottomColor | 设置底边框的颜色 | 4 | 1 | 9 | Yes |
borderBottomStyle | 设置底边框的样式 | 4 | 1 | 9 | Yes |
borderBottomWidth | 设置底边框的宽度 | 4 | 1 | 9 | Yes |
borderColor | 设置所有四个边框的颜色 (可设置四种颜色) | 4 | 1 | 9 | Yes |
borderLeft | 在一行设置左边框的所有属性 | 4 | 1 | 9 | Yes |
borderLeftColor | 设置左边框的颜色 | 4 | 1 | 9 | Yes |
borderLeftStyle | 设置左边框的样式 | 4 | 1 | 9 | Yes |
borderLeftWidth | 设置左边框的宽度 | 4 | 1 | 9 | Yes |
borderRight | 在一行设置右边框的所有属性 | 4 | 1 | 9 | Yes |
borderRightColor | 设置右边框的颜色 | 4 | 1 | 9 | Yes |
borderRightStyle | 设置右边框的样式 | 4 | 1 | 9 | Yes |
borderRightWidth | 设置右边框的宽度 | 4 | 1 | 9 | Yes |
borderStyle | 设置所有四个边框的样式 (可设置四种样式) | 4 | 1 | 9 | Yes |
borderTop | 在一行设置顶边框的所有属性 | 4 | 1 | 9 | Yes |
borderTopColor | 设置顶边框的颜色 | 4 | 1 | 9 | Yes |
borderTopStyle | 设置顶边框的样式 | 4 | 1 | 9 | Yes |
borderTopWidth | 设置顶边框的宽度 | 4 | 1 | 9 | Yes |
borderWidth | 设置所有四条边框的宽度 (可设置四种宽度) | 4 | 1 | 9 | Yes |
margin | 设置元素的边距 (可设置四个值) | 4 | 1 | 9 | Yes |
marginBottom | 设置元素的底边距 | 4 | 1 | 9 | Yes |
marginLeft | 设置元素的左边距 | 4 | 1 | 9 | Yes |
marginRight | 设置元素的右边据 | 4 | 1 | 9 | Yes |
marginTop | 设置元素的顶边距 | 4 | 1 | 9 | Yes |
outline | 在一行设置所有的outline属性 | 5M | 1 | 9 | Yes |
outlineColor | 设置围绕元素的轮廓颜色 | 5M | 1 | 9 | Yes |
outlineStyle | 设置围绕元素的轮廓样式 | 5M | 1 | 9 | Yes |
outlineWidth | 设置围绕元素的轮廓宽度 | 5M | 1 | 9 | Yes |
padding | 设置元素的填充 (可设置四个值) | 4 | 1 | 9 | Yes |
paddingBottom | 设置元素的下填充 | 4 | 1 | 9 | Yes |
paddingLeft | 设置元素的左填充 | 4 | 1 | 9 | Yes |
paddingRight | 设置元素的右填充 | 4 | 1 | 9 | Yes |
paddingTop | 设置元素的顶填充 | 4 | 1 | 9 | Yes |
Layout 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
clear | 设置在元素的哪边不允许其他的浮动元素 | 4 | 1 | 9 | Yes |
clip | 设置元素的形状 | 4 | 1 | 9 | Yes |
content | 设置元信息 | 5M | 1 | Yes | |
counterIncrement | 设置其后是正数的计数器名称的列表。其中整数指示每当元素出现时计数器的增量。默认是1。 | 5M | 1 | Yes | |
counterReset | 设置其后是正数的计数器名称的列表。其中整数指示每当元素出现时计数器被设置的值。默认是0。 | 5M | 1 | Yes | |
cssFloat | 设置图像或文本将出现(浮动)在另一元素中的何处。 | 5M | 1 | 9 | Yes |
cursor | 设置显示的指针类型 | 4 | 1 | 9 | Yes |
direction | 设置元素的文本方向 | 5 | 1 | 9 | Yes |
display | 设置元素如何被显示 | 4 | 1 | 9 | Yes |
height | 设置元素的高度 | 4 | 1 | 9 | Yes |
markerOffset | 设置marker box的principal box距离其最近的边框边缘的距离 | 5M | 1 | Yes | |
marks | 设置是否cross marks或crop marks应仅仅被呈现于page box边缘之外 | 5M | 1 | Yes | |
maxHeight | 设置元素的最大高度 | 5M | 1 | 9 | Yes |
maxWidth | 设置元素的最大宽度 | 5M | 1 | 9 | Yes |
minHeight | 设置元素的最小高度 | 5M | 1 | 9 | Yes |
minWidth | 设置元素的最小宽度 | 5M | 1 | 9 | Yes |
overflow | 规定如何处理不适合元素盒的内容 | 4 | 1 | 9 | Yes |
verticalAlign | 设置对元素中的内容进行垂直排列 | 4 | 1 | No | Yes |
visibility | 设置元素是否可见 | 4 | 1 | 9 | Yes |
width | 设置元素的宽度 | 4 | 1 | 9 | Yes |
List 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
listStyle | 在一行设置列表的所有属性 | 4 | 1 | 9 | Yes |
listStyleImage | 把图像设置为列表项标记 | 4 | 1 | No | Yes |
listStylePosition | 改变列表项标记的位置 | 4 | 1 | 9 | Yes |
listStyleType | 设置列表项标记的类型 | 4 | 1 | 9 | Yes |
Misc 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
cssText | 4 | 1 |
Positioning 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
bottom | 设置元素的底边缘距离父元素底边缘的之上或之下的距离 | 5 | 1 | 9 | Yes |
left | 置元素的左边缘距离父元素左边缘的左边或右边的距离 | 4 | 1 | 9 | Yes |
position | 把元素放置在static, relative, absolute 或 fixed 的位置 | 4 | 1 | 9 | Yes |
right | 置元素的右边缘距离父元素右边缘的左边或右边的距离 | 5 | 1 | 9 | Yes |
top | 设置元素的顶边缘距离父元素顶边缘的之上或之下的距离 | 4 | 1 | 9 | Yes |
zIndex | 设置元素的堆叠次序 | 4 | 1 | 9 | Yes |
Printing 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
orphans | 设置段落留到页面底部的最小行数 | 5M | 1 | 9 | Yes |
page | 设置显示某元素时使用的页面类型 | 5M | 1 | 9 | Yes |
pageBreakAfter | 设置某元素之后的分页行为 | 4 | 1 | 9 | Yes |
pageBreakBefore | 设置某元素之前的分页行为 | 4 | 1 | 9 | Yes |
pageBreakInside | 设置某元素内部的分页行为 | 5M | 1 | 9 | Yes |
size | 设置页面的方向和尺寸 | 1 | 9 | Yes | |
widows | 设置段落必须留到页面顶部的最小行数 | 5M | 1 | 9 | Yes |
Scrollbar 属性 (IE-only)
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
scrollbar3dLightColor | 设置箭头和滚动条左侧和顶边的颜色 | 5W | No | No | No |
scrollbarArrowColor | 设置滚动条上的箭头颜色 | 5W | No | No | No |
scrollbarBaseColor | 设置滚动条的底色 | 5W | No | No | No |
scrollbarDarkShadowColor | 设置箭头和滚动条右侧和底边的颜色 | 5W | No | No | No |
scrollbarFaceColor | 设置滚动条的表色 | 5W | No | No | No |
scrollbarHighlightColor | 设置箭头和滚动条左侧和顶边的颜色,以及滚动条的背景 | 5W | No | No | No |
scrollbarShadowColor | 设置箭头和滚动条右侧和底边的颜色 | 5W | No | No | No |
scrollbarTrackColor | 设置滚动条的背景色 | 5W | No | No | No |
Table 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
borderCollapse | 设置表格边框是否合并为单边框,或者像在标准的HTML中那样分离。 | 5 | 1 | 9 | Yes |
borderSpacing | 设置分隔单元格边框的距离 | 5M | 1 | 9 | Yes |
captionSide | 设置表格标题的位置 | 5M | No | No | Yes |
emptyCells | 设置是否显示表格中的空单元格 | 5M | 1 | 9 | Yes |
tableLayout | 设置用来显示表格单元格、行以及列的算法 | 5 | No | No | Yes |
Text 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
color | 设置文本的颜色 | 4 | 1 | 9 | Yes |
font | 在一行设置所有的字体属性 | 4 | 1 | 9 | Yes |
fontFamily | 设置元素的字体系列。 | 4 | 1 | 9 | Yes |
fontSize | 设置元素的字体大小。 | 4 | 1 | 9 | Yes |
fontSizeAdjust | 设置/调整文本的尺寸 | 5M | 1 | No | Yes |
fontStretch | 设置如何紧缩或伸展字体 | 5M | No | No | Yes |
fontStyle | 设置元素的字体样式 | 4 | 1 | 9 | Yes |
fontVariant | 用小型大写字母字体来显示文本 | 4 | 1 | 9 | Yes |
fontWeight | 设置字体的粗细 | 4 | 1 | 9 | Yes |
letterSpacing | 设置字符间距 | 4 | 1 | 9 | Yes |
lineHeight | 设置行间距 | 4 | 1 | 9 | Yes |
quotes | 设置在文本中使用哪种引号 | 5M | 1 | Yes | |
textAlign | 排列文本 | 4 | 1 | 9 | Yes |
textDecoration | 设置文本的修饰 | 4 | 1 | 9 | Yes |
textIndent | 缩紧首行的文本 | 4 | 1 | 9 | Yes |
textShadow | 设置文本的阴影效果 | 5M | 1 | Yes | |
textTransform | 对文本设置大写效果 | 4 | 1 | 9 | Yes |
unicodeBidi | 5 | 1 | Yes | ||
whiteSpace | 设置如何设置文本中的折行和空白符 | 4 | 1 | 9 | Yes |
wordSpacing | 设置文本中的词间距 | 6 | 1 | 9 | Yes |
Standard 属性
属性 | 描述 | IE | F | O | W3C |
---|---|---|---|---|---|
dir | 设置或返回文本的方向 | 5 | 1 | 9 | Yes |
lang | 设置或返回元素的语言代码 | 5 | 1 | 9 | Yes |
title | 设置或返回元素的咨询性的标题 | 5 | 1 | 9 | Yes |
相关文章推荐
- HTML DOM Style 对象(转)
- HTML DOM Style 对象
- JS-11/10_HTML DOM Style 对象
- HTML DOM Style 对象介绍
- HTML DOM教程 41-HTML DOM Style 对象
- HTML DOM 教程Part4 [DOM 表单对象] 摘录自W3C School
- 3. HTML DOM Attribute 对象
- DOM对象控制HTML无素——详解1
- HTML DOM 对象
- JavaScript HTML DOM节点类型之Element类型(Element对象)
- HTML DOM Window 对象
- javaScript学习之HTML DOM Document对象
- DOM对象控制HTML
- html的DOM中document对象forms集合用法实例
- HTML DOM Document 对象
- HTML DOM Document 对象
- IE 混淆了 DOM 对象属性(property)及 HTML 标签属性(attribute),造成了对 setAttribute、getAttribute 的不正确实现
- JS总结之二:DOM对象控制HTML
- HTML DOM Attribute 对象
- DOM 对象控制 HTML