页面布局设置

Web 2010-09-29 08:57:50 阅读5 评论0 字号：大中小订阅

在1024*768的机器上如果正常的话，建议的最大页面宽度和页面高度为：
1024-28=996 px
768-170=598 px

东西都是我自己搞模版的时候正好需要，以后怕再找东西，就放在博客里了。不晓得为什么会有人这样？博客宣传里不是提倡这里是生活的地方么，难道平民草根在这里就不能生活了？

@import url("/fbui/share/comment_1.css");
@import url("/fbui/share/search_1.css");
@import url("/fbui/share/calendar_1.css");
.rss,.rss_c{display:none;}/* 去掉rss图标 */
en {display:none;}或.cn {display:none;}/* 语言 */

1、body{background:背景颜色;color:前景颜色;background:url(图片地址);font-familiy:字体;font-size:字体大小;}

2、a:link{}/* 全局超链接设置 */
      a:hover{}
      a:visited{}
#XXX{定义普通状态字体和这块儿区域的样式}   -------这个#XXX{}是本身存在的，下面的三个是后添加的
#XXX a:link{定义链接字体样式}
#XXX a:hover{定义鼠标移到链接时的字体字体样式}
#XXX a:visited{定义已访问过的链接}

3、布局
       (1)、页面居中，边拦居左
#wrapper {width:778px;margin:auto;}
   #head{}
   #main{}
        #sidebar {float:left;width:200px;}
        #content {margin:0 0 0 205px;}
#footer{}
       (2)、页面居中，边拦居右
#wrapper {width:778px;margin:auto;}
   #head{}
   #main{}
        #sidebar {float:right;width:200px;}
        #content {margin:0 205px 0 0;}
   #footer{}
       (3)、页面全屏，边拦居右
#head{}
#main{}
      #sidebar {float:right;width:200px;}
      #content {margin:0 205px 0 0;}
#footer{}
       (4)、页面全屏，边拦居左
#head{}
#main{}
     #sidebar {float:left;width:200px;}
     #content {margin:0 0 0 205px;}
#footer{}

4、#sidebar边栏
#sidebar h2{}/* 边栏头部 */
     .sidesub{}/* 边栏框体 */
     .sidesub h3{}/* 边栏头部标题 */
    .sidesub h3 span{}/* 边栏头部标题内容 */
   .sidesub_c{}/* 边栏头部内容项 */
   .sidesub. space{}/* 边栏底部 */
#sfooter{}/* 边栏底部*/
边栏个别设置以id=lastestpost为例
#lastestpost{}
#lastestpost h3{}
#lastestpost h3 span{}
#lastestpost _c{}
#lastestpost .spaces{}
最新发表lastestpost
最近推荐highlight
最新回复comment
统计信息total
日志搜索search
友情链接links
其他信息other

5、#content
#chead{}/* 内容头部及内容 */
#log{}/* 日志部分 */
　　#loghead{}/* 日志部分头部 */
　　#loghead span{}/* 日志部分头部内容 */
　　#log.notes{}/* 日志部分公告*/

　　.normallog{}/* 普通日志列表 */
                .normallog h4{}/* 列表之标题和时间 */
　　　　　　.normallog h4.time{}/* 时间和按钮 */
　　　　　　.normallog h4 a{}/* 标题 */
　　      .normallog h5{}/* 列表之栏目与作者 */
                        .normallog h5 .auther{}/* 栏目 */
                        .normallog h5 .category{}/* 作者 */　
　　　   .normallog .text{}/* 列表之简介 */
　　　   .normallog h6{}/* 列表之计数 */
                        .normallog h6{}/* 回复 */
                        .normallog h6 .track_c{}/* 引用 */
                        .normallog h6 .read_c{}/* 阅读 */
　
　.photolog {} /* 图片日志列表 */
　　　 .smallimages {}/* 图片缩略图 */
　　　   .photolog h3 {} /* 图片之标题 */
               .photolog ul {}/* 图片之计数和时间 */
                       .photolog .hits {} /* 阅读 */
                       .photolog .commrnts {}/* 回复 */
                       .photolog .posttime {} /* 时间 */
             .photolog p {} /* 图片之简介 */