欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  后端开发

php实战第十九天_PHP教程

程序员文章站 2022-05-04 17:46:54
...
今天涉猎了 ps,以及做了一个顶部导航条固定,下面给一个效果图布局.利用得是 position:fixed

php实战第十九天_PHP教程


[html]



无标题文档







a

b

c

d

e

123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789







无标题文档




a

b

c

d

e

123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789
123456789




css代码


[css] @charset "utf-8";
/* CSS Document */
*{
margin:0px;
padding:0px;
font-size:14px;
}
body{
background-color:#ECECEC;
}
#head{
position:fixed;
top:0px;

background:#FAFAFA;

width:100%;
height:54px;

border-bottom: 1px solid #E8E8E8;
box-shadow: 0 1px 5px rgba(34, 25, 25, 0.2);
z-index:100;

}

#header{
margin:0 auto;

width:960px;
height:54px;
}
.nav{
float: left;
height: 54px;
width: auto;
}

.nav ul ,.nav li{
float: left;
list-style: none outside none;
}

li a{
padding: 0 15px;

color: #585858;
display: block;
line-height: 54px;

border-right: 1px solid #E8E8E8;
}


#main{
position:relative;
top:66px;

margin:0 auto;
padding:10px;

width:960px;

background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #C7C7C7;

}

@charset "utf-8";
/* CSS Document */
*{
margin:0px;
padding:0px;
font-size:14px;
}
body{
background-color:#ECECEC;
}
#head{
position:fixed;
top:0px;

background:#FAFAFA;

width:100%;
height:54px;

border-bottom: 1px solid #E8E8E8;
box-shadow: 0 1px 5px rgba(34, 25, 25, 0.2);
z-index:100;

}

#header{
margin:0 auto;

width:960px;
height:54px;
}
.nav{
float: left;
height: 54px;
width: auto;
}

.nav ul ,.nav li{
float: left;
list-style: none outside none;
}

li a{
padding: 0 15px;

color: #585858;
display: block;
line-height: 54px;

border-right: 1px solid #E8E8E8;
}


#main{
position:relative;
top:66px;

margin:0 auto;
padding:10px;

width:960px;

background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #C7C7C7;

}

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/477332.htmlTechArticle今天涉猎了 ps,以及做了一个顶部导航条固定,下面给一个效果图布局.利用得是 position:fixed [html] !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional...