校内网css代码详细教程
下面我会详细的说明，并一步步教大家如何美化。如果不明白处，请在下面留言。
注意此教程我写得很详细,主要是照顾那些刚接触CSS有同学，
所以内容相当多，劳你耐心看下来，对你是帮助的。
小提示：如果你在阅读本教程中有任何不明白处都可以在下面回复栏里回复,说明你的问题，
我会再详细的为你解答。
再提示：其实看完这篇教程很多人还是糊里糊涂的，这是正常的，但是你看完这篇教程，
你至少应该懂得如果我要加个大壁纸图片做背景，我知道复制哪一部分代码，
修改里面的某些属性的值，就可以有我自己要的效果。在本文的最后，我会给出完整的代码
，并标上注释。如果你认真看完此篇，完全可以自由的DIY.
另本人也没系统学过CSS，也是慢慢积累的，如有错误欢迎大家指导更正。
校内网粗略布局结构如下:(颜色相同为同一层次)
<body id="profilePage">
<div id="container">
<div id="header"></div>
<div id="sidebar"></div>
<div id="widebar">
<div id="navigation"></div>
<div id="content">
<div id="userRelations"></div>
<div id="userStatus"></div>
</div>
<div id="footer"></div>
</div>
</body>
熟悉上面的结构，因为布局常用到对应该的id。
附上校内网的完整结构层次图
好了,如果让你来美化,你第一步会想到什么?
加个个性背景图片,对么?
你上网去找到你喜欢的图片,也可以在这里找找
http://www.Bo-u.cn/show-15-1.html
我们随便找一个,比如这个图片
找到图片后,怎么写代码呢?
小提示：找到的图片一定要再上传到校内网去，这样可以保证图片的有效性；
而且切记只能用在写日记那里的上传图片功能，这样图片不会变形。
body {
padding:0;
margin:0;
background:url(upload/2007_12/071228043573731.gif) repeat;}
把上面代码放到涂鸦板中去,保存一下,看看有没有效果.
分析:
body 为什么是body呢,因为是整体页面的背景,你对比下校内网粗略布局结构就知道.
padding和margin分别是填充距和边距的意思，下面我会讲到，先略过。
background 这句是有格式的background:url(图片地址) repeat; repeat是完全平铺的意思,
因为图片比较小张,如果是壁纸,那图片够大了,可以用no-repeat替换,如果背景图片是细长型的,
那就水平平铺,用repeat-x替换.细窄的就用垂直平铺repeat-y;
如果替换替换如果你图片只有屏幕那么大,那你还可以固定你的背景,加个fixed就OK,
格式是background:url(图片地址) no-repeat fixed;
如果你上面看不懂。你只要明白，我给整个页面加个背景的代码是
- body {
- padding:0;
- margin:0;
- background:url(你的图片地址) repeat;}