css3-对齐、分类、导航栏

1 对齐操作

.div{ width: 70%; height: 1000px; background-color: red; /*使用margin居中效果*/ /*margin-left: auto;*/ /*margin-right: auto;*/ /*margin: 100px auto;*/ /*使用position进行右对齐*/ /*position: absolute;*/ /*right: 0px;*/ /*float属性设置对齐方式*/ /*float: right;*/ /*float: left;*/ }

line-height 行高
max-height
max-width
min-width
min-height
width
height

2 分类操作
属性：
clear——设置一个元素的侧面是否允许其他的浮动元素
cursor——规定当指向某个元素之上时显示的指针类型
display——设置是否及如何显示元素 （可以让列表显示在一行中：
display: inline; //用来做菜单导航栏
）
float——定义元素在哪个方向浮动
visibility——设置元素是否可见或不可见

3 导航栏

垂直导航栏：

<ul>
    <li><a href="#">导航1</a></li>
    <li><a href="#">导航2</a></li>
    <li><a href="#">导航3</a></li>
    <li><a href="#">导航4</a></li>
</ul>

CSS3：
ul{
    list-style-type: none;
    margin: 0px;
    padding:0px;
}
a:link,a:visited{
    text-decoration: none;
    display: block;
    background-color: burlywood;
    color: aliceblue;
    width: 50px;
    text-align: center;
}
/*hover是指鼠标放在A标签上的时候*/
a:active,a:hover{
    background-color: crimson;
}

水平导航栏：

 只需要把第一个display删除，在li属性添加   display:inline

就会出现水平导航栏的效果

图片的透明度： poacity:0~1