第15课 综合布局实践
这是这个系列的CSS视频教程的最后一课了。对应于《CSS设计彻底研究》一书的最后三章,希望本系列的视频教程《CSS设计彻底研究》这本书能够为广大读者提供一定的实实在在的帮助。
希望读者能够把CSS真正掌握好,从实际工作的角度来说,如果读者能够把《CSS设计彻底研究》中的所有案例都非常清楚地掌握好,一般的设计的任务应该都是足以胜任了的。当然,任何一本书都不可能把所有的问题都解决,归根到底掌握学习和探索的方法才是根本。现在技术飞速发展,实际上只有善于学习的人才能立于不败之地,衷心预祝广大读者能够站在技术的前沿,把握技术的脉搏,获得更大的成功!谢谢您的观看!
本节课时长16分25秒,下载文件20.0兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载。
以下为本课的讲义,供大家参考。
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
















我想请教您一个问题,就是我用div+css而已的页面,浏览时字都跑了,但是我点一下浏览器兼容性视图,就又正常了,我用的是ie9,我想问一下这个怎么解决啊,请您给予帮助!!谢谢、、
讲的很好,辛苦啦,谢谢!
[…] 第 14课 不固定宽度布局(上) 第 14课 不固定宽度布局(下) 第 15课 综合布局实践 分类: 非礼勿言 标签: ccs+div, css, css教程, seo, w3c标准, 网站优化, 网站重构 […]
[…] 第 14课 不固定宽度布局(上) 第 14课 不固定宽度布局(下) 第 15课 综合布局实践 分类: 非礼勿言 标签: 评论 (0)Trackbacks (0) 发表评论 […]
这个网站真的非常不错,非常的感谢老师们无私的奉献,我学到了很多了东西,给了我很多的信心也希望!呵呵,说得有点过,不过真的从内心里感谢老师们!“相见恨晚”呵呵。
老师,怎么用火狐浏览器把禅意花园的一些作品下载下来呢,比如,在《彻底研究》这本书中的第407页的禅意花园191号的作品,最好能全部保存下来,在脱机情况下仍能够看到和线上一样的效果。火狐浏览器的文件中的保存都没有能全部保存下来完呢。
keke ,
用专用的下载工具,可以下载全站的那种,就可以了,用浏览器似乎都不行,会漏掉一些文件下不下来。
《彻底研究》这本书中第402页的#footer设置成绝对定位后,在Dreamweaver中的设计部分没有显示出来,是怎么回事呢
keke ,
如果使用CSS布局,就不要管Dreameaver了,就把DW当作一个文本编辑器就可以啦,具体效果千万不要管DW是怎么显示的。
《彻底研究》这本书中的第399页中,既然#container的宽度设置成760px, padding设置成10px了,然而quickSummary部分的宽度却设置成260px,preamble部分的宽度设置成490px,两个加起来即260+490=750px,比container内部只能存放的宽度(760-10*2=740px)多出10px了,老师,这个怎么解释呢?
不好意思,老师,我理解错了,宽度是只内容的宽度,不包括padding的,呵呵,翻看书中前面的知识才搞清楚,呵呵
keke ,
是的,CSS标准中宽度不包括padding,旧版本的IE会包括。
等比例布局,25%和75%图像的覆盖是实在看不懂,我觉得我和我朋友智商都算高的。呵呵!这本书还是不实用初学者,作者使用的文字不够易懂。可能对于有基础的一下子就看懂了呵呵。还是去学校吧,自学的太疼苦
峰峰,
从第一章开始看,真正立即了盒子模型、标准流、浮动、定位 这4打基础原理之后,这些方法就很容易理解了。如果前面的道理没有明白,这些方法就会很难理解。
再次感谢~~
wowo ,
谢谢您的鼓励!
欢迎常来这里交流!
老师,为什么这些视频一个也看不了啊?
pengjie ,
我这里看得没有问题,您在试试看?
老师 您好 我最近每天晚上都在看你们的视频来学习CSS
最后一节 您用什么工具把网页各个元素分割的那么精确
只是用草图先构建结构 然后画出来的么?
看到你分割的布局图 精确到了像素
我觉得一切的变的有条理了 也变的简单生动了
我买了那两本书 只是还没收到
特别期待早日拿到那两本书 来加深对CSS的理解
还有就是如果想使自己的网页设计水平能大幅度提高
那么JAVASCRIPT是不是必须要学的啊?
如果必须要学javascript 是不是先必须学C语言之类的基础语言才能学懂它啊?
谢谢老师了!
dowson ,
切图可以用Photoshop或者Fireworks,都可以非常精确地把图切成你需要的大小。
设计师如果没有变成基础,也可以学习JS,不用掌握得很深,会一些基本的操作即可了。如果要深入掌握,那就需要比较好的编程基础了。
希望你能掌握!
老师好啊:
问你个关于相邻边框合并的问题,在制作选项卡菜单(就是你们教程中讲的tab菜单)的时候,想让他相邻的边框合并成一条边框,因为定的书还没来,想尽快知道答案,我在css里面设置了border-collapse:collapse;但是不管用,想问以下应该怎么写,谢谢!!!!
q276133913,
border-collapse:collapse 这个属性只对表格有效,如果是div,你可以用相对定位的方法让他平移几个像素。你试试看?
哦,怪不得呢,呵呵, 还是不够智能啊, 能应用div边框该多好,谢了,,,,,,,支持前沿….
q276133913,
还有一个办法,就是你的各个Tab都只有左边,没有右边,这样并列在一起,相邻的两个Tab之间就只有一条边框了,然后把最右边的一个Tab作特殊处理,让他左右都有边框即可。
从《精通CSS div》光盘过来的,书和教程都很实在。大家都是一线的设计师嘛。
期待《CSS设计彻底研究》这本书。
支持和感谢你们。
swordfish,
好啊,希望我们可以有更多的交流,这对于大家提高都很有帮助的!