|
这部分里行与行的背景色是相间的，只要指定两个颜色样式，对相应的列表指定就行了。
中部还剩下最后一块：四个门户网站的链接。每一个门户包含在一个<div>里，然后应用左浮动。由于外层的<div>指定了宽度，四个方框排成两行，第一行是绿色边框，第二行是蓝色边框，写边框样式的时候以上面两个的颜色为主，另外两个在内联样式中改写一下。边框中的内容都改在列表里。列表第一行是标题，需要应用标题样式再向左浮动，哈哈效果比原来的还好。列表第二行还需要定义clear:right;这样就使剩下的三行不产生浮动。
在修改过程中遇到了的一些莫名其妙的问题，还想特别说明一下：
左右两部分始终对不齐
这是一开始的左侧部分样式：
#mainleft1 ul {
font-size: 10px;
}
#mainleft1 li {
line-height: 24px;
}
在这个样式下预览的时候不同的浏览器显示的效果是不一样的，
后来我将样式修改了问题才解决了：
#mainleft1 li {
font-size: 10px;
}
#mainleft1 a {
line-height:24px;
}
看上去这两个样式实现的功能是一样的。但是效果不一样，也许是默认样式的问题吧！
IE 的bug
这个问题的的确确是莫名其妙,看一下效果：
仔细看一下多出来四个字，会让人很惊讶哦。在其他的浏览器里倒是没有个问题，如果四个方框的间距设的小一些也没有这个问题，最后没有办法只好设置了overflow:hidden 将其隐藏。
到此，中间部分的处理就结束了。
第三步尾部处理
修改过前两部分后，这一部分就容易多了，制定一个#bot1，每一个框应用一次,再应用几个无序列表，构成基本外观。在这一部分遇到的问题是：链接不能左对齐，指定了text-align：left;也不能,最后只好对每一行设置不同的边界、填充，达到对齐的效果。
这样整体就基本完成了。剩下的工作就是细致的调整边框对齐和各部分的空白了。整个工程我花了三天的时间，两天完成基本任务，最后一天用来做细致的调整。最后的文档大小为48.8k比原来的大小整整小了30k呢
最后的完成源文件可以在我的网站找到，点击浏览。
最新的修改2005-10-13
2005-10-28日修改，修正了在ie下显示不正常的部分。
（编辑：焦作站长网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
