您的位置:首页 > Web前端 > CSS

html 页面布局样式

2016-03-29 14:24 447 查看
<link href="css/main.css" rel="stylesheet" type="text/css"/>

<script src="js/****.js" type="text/javascript"  charset="gb2312"> </script>

*

{

padding:0 px;

margin: 0 px;

font:12px;

}

<!-- 这里可以将一些系统默认的标签的填充和间距还原-->

body{

background-color:#F5F5F5;

}

<--!将背景设置成灰色-->

下面是顶部式样:

.top{

width:100%;

height:27 px;

backgroud:url(../images/top_bg.jpg) repeat-x;   <--!这地方是将小灰色的线条图片,循环填充作为背景-->

}

.top_content

{

width:1000px;                                             <--! 1000px 绝对已经够用了-->

margin:0 auto;                                   <--! 上下边距是0,左右边距根据width自动填充-->

}

.top_content li{                                              
 <--!设置顶部的项目内容-->

   list-style-image:url( 这地方填写图片地址)       
<--!这地方完成的是项目内容前面的小标记-->

float:right;                                                          <--!设置右浮动,完成排列,项目需要反向序列-->

width:70 px; <--!中间需要拉开一些间距-->

line-height:27px;                                                  <--!设置的和top的高度是一样的,可以完成在垂直方向上的居中-->

}



内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: