html版面整体向下,HTML 之 标准版面设计

代码

Title

.pg-header{

/*position用于固定标题头永远放在上面*/

position: fixed;

right:0;

left:0;

top:0;

background-color: #2459a2;

/*height、line-height用于设置行高，并将内容居中*/

height: 48px;

line-height: 48px;

}

.pg-body{

background-color: white;

/*margin-top: 用于设置去顶部的边距，头部是48px,所以这里是50px,预留了一部分空间;*/

margin-top: 48px;

height: 5000px;

}

.w{

/*width:为头部具体内容宽度;*/

width: 980px;

margin: 0 auto;

}

.pg-header .menu{

/*使其既具有block的宽度和高度特性*/

display: inline-block;

/*使该标签的上下边距为0，左右边距为10px*/

padding: 0 10px;

color: white;

}

/*当鼠标放到此位置时，进行背景颜色替换 */

.pg-header .menu:hover{

background-color: aqua;

}

LOGO

全部

42区

社区

段子

1024

登陆

注册

bbbb

展示

标签：48px,header,color,top,height,标准,HTML,版面设计,pg

来源： https://blog.51cto.com/12965094/2368487