1.居中对齐(块级,内联)
margin:auto;
text-align:center;
2.尺寸
设置高度(高度,最大高度,最小高度)
height:10px;
max-height: 10px;
min-height:5px
设置宽度(宽度,最大宽度,最小宽度)
width:200px;
max-width: 300px;
min-width:200px;
设置行高
line-height: 10px
3.元素显示——内联,块级,隐藏
p {display: inline}
span{display: block} div {display: none}
4.水平导航栏
<html> <head> <style type="text/css"> ul { float:left; width:100%; padding:0; margin:0; list-style-type:none; } a { float:left; width:5em; text-decoration:none; color:white; background-color:#c3c3c3; padding:0.2em 0.6em; border-right:1px solid white; } a:hover {background-color:#ff3300} li {display:inline} </style> </head> <body> <ul> <li><a href="#">Link one</a></li> <li><a href="#">Link two</a></li> <li><a href="#">Link three</a></li> <li><a href="#">Link four</a></li> </ul> </body> </html>
5.元素可见与隐藏
.class1 {visibility:visible} .class2 {visibility:hidden}
visibility:hidden和display:none有区别:
visibility:hidden——对象隐藏后,还有占有相应的空间大小
display:none——对象隐藏后,对象不占任何空间
6.改变光标
cursor:auto 自动
cursor:default 箭头
cursor:pointer 手指
cursor:text 文本
cursor:wait 转圈
cursor:help 帮助
浙公网安备 33010602011771号