校内网代码教程

校内网代码教程

一、页面各模块属性。#homepage 页面全部元素#header 顶部导航栏#footer 底部导航栏#sidebar 左侧导航栏#content #homepage中除#header、#footer和#sidebar外其余部分#userInfo 个人照片和用户行为部分#userVisitor 最近访问好友#userFriend 最近登陆好友#userFriendUniv 外校好友#userProfile 个人资料部分#userBlog 日志部分#userPandora 涂鸦板#userStatus 用户状态#userShare 用户分享#userFriendSpecial 特别好友二、具体实现1、移动homepage参数说明:overflow:visible :此处不做说明,在后面一起说明。position : relative : 对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置。用通俗点的话讲,就是在当前所在的框架内移动,而不流出。关于position更详细的说明,参考css2.0中文手册,我的网络U盘里可以下载,lxcnn.5u6.netwidth:宽度。如有需要,可以加个height参数调整高度。left:相对移动距离。正值为向右移动,负值为向左移动。这个值要结合content一起调整,开始给270px这个值时,会使homepage部分偏右,而调整content后,页面将回到居中位置。当然,如果有需要,还可以加上top参数,以调整垂直方向的位置。2、移动content参数意义同上这里因为移走了sidebar,所以这里的width取值与homepage相同。、加宽及移动个人资料、相册、日志和涂鸦板参数意义同上4、移动sidebar我这里修改了一下border的属性,如果单纯移动sidebar可用下面代码参数说明:position:absolute : 将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。而其层叠通过z-index属性定义。此时对象不具有边距,但仍有补白和边框。其中z-index:1;表示置于顶层。此处如果不加这一参数,sidebar移动到这一位置时,链接将无法点击。其余参数同上5、移动header参数意义同上6、关于overflow:visible;overflow:visible : 不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效举例说明吧,代码都是写在涂鸦板内的,所以如果不用position:absolute进行绝对定位时,所加的图片或flash等都是在涂鸦板内的,此时我的涂鸦板位置移动了,我再要绝对定位flash如我顶部的导航栏,就要在#content#userPandora的代码内加上overflow:visible;才能使原本在涂鸦板内的flash绝对定位的显示。而涂鸦板又是在content中的,content也移动了,所以content也要加上,同理,homepage也要加上。在移动了相关部分,关在各部分代码里加入overflow:visible;参数后,用绝对定位代码定位图片或flash时,如果图片或flash不见了,可以把定位代码里的left和top的值调小或置零,然后再一点点的调整好位置。更多的校内网的知识建议你看看http://hi.baidu.com/yinran/blog/category/%D0%A3%C4%DA%CD%F8%CD%BF%D1%BB%BD%CC%B3%CC 那里有很多