简单的切就按我下面的图片显示的来切就行了。
说明一下：
01切片
就是一大背景，学校名那一区域可以用1x1透明像素的gif图片来定宽和高之后，做链接。
搜索框可以将input的背景设置为做好的1x1透明像素，右边的搜索按钮也可以用1x1透明像素定宽和高来取尺寸。
上面的都能给头部header一个position:relative，然后链接和搜索框都用absolute来定位。
如果你想尺寸小一点，可以细切，渐变背景切一块，其他元素切一块就行了。
02切片
这是为了补那个渐变的，因为设计人员的渐变太高了，这个切片做成repeat-x平铺的背景。
04切片
为了省事，并且也因为此栏目的背景是一个渐变色，如果干脆切一大块吧，这是在04切片高度固定的情况下，如果高度可能会变，那就分成上中下三个部分来切。
06切片和09切片
同04切片
13切片
这是底部的渐变，也是做成背景后repeat-x来平铺
其他的小图标
可以单切一个就行，做的时候加上
html代码部分说明：
01切片为header
02、04、06、09为container
13切片为footer
其中04、09可以为content，06为sidebar
然后content为浮动左边float:left、sidebar为浮动右边float:left
给content和sidebar都给一个 display:inline来兼容一下IE6
然后content的margin-left为多少，在PS中量一下，sidebar的margin-right为多少，也量一下。
其他小的地方不难，自己做吧。
切片图见下
方法没错，想学好编程，就要先背别人的代码。内容多，但是常用的不会太多，都要背下来，多敲代码，默写代码，写不出来了在去看，这样学的快。还有你要考虑清楚，自己是要开发前端还是后台的程序。开发前端学html+css+javaScript就够了学这个的话我觉得在网上看教程其实就行了，比如比较有名的w3school在线教程、w3cschool在线教程(这个比较商业化)、菜鸟教程，里面有很多计算机编程言语的教程，包括前端部分的HTML5、css3和js等，当然js如果要往更高阶的地方学习的话，还可以推荐去看看大神廖雪峰写的廖雪峰教学，还有阮一峰的JavaScript标准参考教程，比较权威。
如果真的想要买书的话，也值得推荐：
css学习：
JavaScript学习：
这些基本在淘宝上都可以买到，希望我的回答能帮到你，祝你学习愉快！
