list-style 简写属性在一个声明中设置所有的列表属性。该属性是一个简写属性,涵盖了所有其他列表样式属性。由于它应用到所有 display 为 list-item 的元素,所以在普通的 HTML 和 XHTML 中只能用于 li 元素,不过实际上它可以应用到任何元素,并由 list-item 元素继承。可以按顺序设置如下属性:list-style-typelist-style-positionlist-style-image可以不设置其中的某个值,比如 “list-style:circle inside;” 也是允许的。未设置的属性会使用其默认值。
<!DOCTYPEHTML>
<html>
<head>
<meta charset="utf-8">
<title>缩放元素</title>
<style type="text/css">
ul {
margin-top:30px;
list-style:none;
line-height:25px;
font-family:Arial;
font-weight:bold;
}
li {
width:120px;
float:left;
margin:2px;
border:1px solid #ccc;
background-color:#e4e4e4;
text-align:left;
}
li:hover{
background-color:#999;
}
a{
display:block;
padding:5px 10px;
color:#333;
text-decoration:none;
}
a:hover{
background-color:#f90;
color:#FFF;
-webkit-transform:scale(0.8,-1.5);
-moz-transform:scale(0.8,-1.5);
-o-transform:scale(0.8,-1.5);
-ms-transform:scale(0.8,-1.5);
transform:scale(0.8,-1.5);
}
</style>
</head>
<body>
<ul>
<li><a href="#">HTML5</a></li>
<li><a href="#">CSS3</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">Ajax</a></li>
</ul>
</body>
</html>
转载请注明原文地址:https://ipadbbs.8miu.com/read-44790.html