页面布局设置
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 {778px;margin:auto;}
#head{}
#main{}
#sidebar {float:left;200px;}
#content {margin:0 0 0 205px;}
#footer{}
(2)、页面居中,边拦居右
#wrapper {778px;margin:auto;}
#head{}
#main{}
#sidebar {float:right;200px;}
#content {margin:0 205px 0 0;}
#footer{}
(3)、页面全屏,边拦居右
#head{}
#main{}
#sidebar {float:right;200px;}
#content {margin:0 205px 0 0;}
#footer{}
(4)、页面全屏,边拦居左
#head{}
#main{}
#sidebar {float:left;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 {} /* 图片之简介 */
.loglog {} /* 日志内容 或 */
.loglog h4 {} /* 日志之标题和时间 */
.loglog h4 .time {}/* 时间和按钮 */
.loglog h4 a {} /* 标题 */
.loglog .text {} /* 日志之简介 */
.loglog h6 {} /* 日志之计数 */
.loglog h6 .auther {}/* 栏目 */
.loglog h6 .category {} /* 作者 */
.loglog h6 .commment_c {}/* 回复 */
.loglog h6 .track_c {} /* 引用 */
.loglog h6 .read_c {} /* 阅读 */
6、底部
#footer{}/* 底部框体 */
#footer p{}/* 底部内容 */
CSS具体
1、FONT:
鼠标
滤镜:filter:filtername(parameters)