当前位置：首页 > 文章评论 > 评论内容

CSS网页布局入门教程4：二列固定宽度

共有 39 位网友发表了评论　我要评论..
sinianfu(125.47.*.*) 发表于：2010-07-08 09:48:03
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> <!-- #layout1 { background-color: #00CCFF; height: 200px; width: 100px; float: left; } #layout2 { background-color: #3399FF; height: 200px; width: 100px; border-top-color: #66CCFF; border-right-color: #66CCFF; border-bottom-color: #66CCFF; border-left-color: #66CCFF; float: left; } --> </style> </head> <body> <div id="layout1">此处显示 id "layout1" 的内容</div> <div id="layout2">此处显示 id 啊实打实的内容</div> </body> </html> 老师以后 我把第一个对象和第二个对象float都设置为left才能达到这章教程的效果 为什么我插入标签没有那个选项
管理员回复：插入哪个标签没有哪个选项？
ping791020(123.15.*.*) 发表于：2010-07-07 10:57:21
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> <!-- #zuo { background-color: #99CCFF; height: 200px; width: 300px; border: 2px solid #0066FF; } #zhongjian { background-color: #FFFFFF; float: left; height: 200px; width: 300px; border: 2px solid #FF6600; } --> </style> </head> <body> <div id="zuo">此处显示 id "zuo" 的内容</div> <div id="zhongjian">此处显示 id "zhongjian" 的内容</div> </body> </html> 老师帮忙看下老是上下排列而不是左右排列。谢谢
管理员回复：你把zuo也浮动试试
ping791020(123.15.*.*) 发表于：2010-07-07 10:50:28
老师你好，为什么我做的二列固定宽度 是上下两行（也就是上面一个，下面一个），而不是在一行上2个？ 帮忙解答，谢谢。
管理员回复：请认真对照本节教程的代码
jiaquan2401(125.38.*.*) 发表于：2010-05-20 16:37:52
float: left; 这一讲的关键内容被你忽略了...所以上下排列了.
songaixiang(119.162.*.*) 发表于：2010-05-17 16:30:38
float的浮动是相对于网页呢还是相对于前一个对象？
管理员回复：相对于当前对象
る~Claire★(218.86.*.*) 发表于：2010-03-10 14:16:22
在里面怎么没有居中方式
管理员回复：这是个固定宽度的实例
957239918(125.39.*.*) 发表于：2010-02-06 09:44:41
float使用none值时表示对象不浮动，而使用left时，对象将向左浮动，例如本例中的div使用了float:left;之后，右侧的内容将流到当前对象的右侧。使用right时，对象将向右浮动，如果将#left的float值设置为right，将使得#left对象浮动到网页右侧，而#right对象则由于float:left;属性浮动到网页左侧。 学习效果出来了就是这段话 晕
财富之门.中国(58.83.*.*) 发表于：2010-02-03 22:46:13
第四个看的有点费劲！不过还是会了！睡觉
qingfeng(119.126.*.*) 发表于：2010-01-22 13:52:53
不错，谢谢！
小根哒(121.26.*.*) 发表于：2009-12-27 19:36:06
非常感谢分享。
管理员回复：不客气
yyt(218.86.*.*) 发表于：2009-12-04 20:48:02
qq375776626
小白(117.79.*.*) 发表于：2009-11-22 00:09:40
做了5变都是 上下排列不是左右排列啊……怎么回事啊？（代码如下请老师指点） 无标题文档 <!--#右边 { background-color: #66CC99; height: 300px; width: 200px; border: 1px solid #00FF66;}#左边 { background-color: #FF0000; height: 300px; width: 200px; border: 1px dashed #FF0000;}--> 此处显示 id '#左边' 的内容
管理员回复：id和class请使用英文名称
div(58.60.*.*) 发表于：2009-11-17 16:27:57
这个有问题，窗口缩小的话 后面一列会退到下一行怎么解决？
管理员回复：固定父div的宽度就解决了
口袋(123.130.*.*) 发表于：2009-10-20 13:01:55
本节学习完毕，很好的教程！
管理员回复：欢迎学习
John(114.243.*.*) 发表于：2009-09-15 10:44:17
文章不错，上述有些问题：可以解释一下！ 如果不是左右排列，你一定把FLOAT 的左右看错了。《LEFT=A，RIGHT=B》作者的FLOAT 全是LEFT 两个框中间一个线是粗的。如果A用了LEFT B用了RIGHT 会左右分开。如果是A和B中没有了一条FLOAT或者是NONE 的话。就会变成上下排开了。
管理员回复：建议以后不要采用这咱命名方式，容易混。比如侧边栏可以命为sidebar，主体部分为main。这样就清楚了
div+css(116.207.*.*) 发表于：2009-08-04 08:03:09
二列固定宽度——AA25.CN <!--#content{margin:0 auto; width:600px;}#contenter{margin:0 90px;width:600px;height:'200'}#left { background-color: #E8F5FE; border: 1px solid #A9C9E2; float: left; height: 300px; width: 200px; margin:5px; padding: 8px;}#right { back
hzbjp(125.122.*.*) 发表于：2009-07-27 12:09:46
你好，看了你的文章，真不错，但我操作起来还是有点难，我就是想在现在的模板下把三栏改为两栏，这个要如何改呢，我在DW里也操作了，但总是不成功。我网站目前，有页面，分类页面，文章页面，它们都是三栏的，我是想把文章页面改成二栏就可以了，这个如何操作，能否指点下。谢了，
管理员回复：可以参考本站的css常用网站布局中的对应案例，对着修改
烟火(202.110.*.*) 发表于：2009-07-09 00:13:22
在本例中的#right { background-color: #F2FDDB; border: 1px solid #A5CF3D; float: left; height: 300px; width: 200px;}中的float: left;去掉怎么效果也是一样的啊，但是在后面二列固定宽度居中这一章中去年同样的float: left;（#right ），它的效果是居中了，就不是二列了呢？请一定要回答啊，谢谢！
管理员回复：因为本身就居中的呀。建议不要去掉。
jskr(125.45.*.*) 发表于：2009-07-06 14:17:08
为什么我操作出来的不是左右排列.而是上下排列呀?真是郁闷~
管理员回复：那得看源代码才能看出是哪儿的问题，建议你再对照一个例子，看看哪儿不同
新手(121.63.*.*) 发表于：2009-07-05 09:05:34
是啊。这两天只要是我自己输入的东西，它都不显示。从网站上复制的都可以显示。我都很无语了。dr中都能看到效果，ie6中就是不可以。我要不要试试遨游啊！
管理员回复：傲游也是IE内核。如果在IE下显示不正常，两个应该是一样的。试下FF吧
新手(121.63.*.*) 发表于：2009-07-04 10:18:48
我想问下，我按着做了。为什么我作的效果，在ie6中有时可以显示，有时就不能显示，这是为什么？
管理员回复：不会吧，IE6会出这种问题，我还是第一回听说，虽然它很垃圾
初学者(58.244.*.*) 发表于：2009-07-01 14:46:02
这个网站挺不错的讲的挺详细的，我想问的是现在是不是用CSS布局的多呢，
管理员回复：那当然
彩虹(218.5.*.*) 发表于：2009-05-25 08:06:36
我加了47972032群,怎么里面没有人啊,是不是我操作错了.还有我在学'二列固定宽度的时候'选中'在标签之后',再按'确定',后面的操作就没有了,为什么啊,急盼回复!
管理员回复：那是你加错了。选中在标签之后的前提是你先选择一个标签，然后添加div时选择在标签之后。
玩哈网(123.146.*.*) 发表于：2009-05-13 08:37:47
我刚学会的，我的站，用css+div做的，虽然简单，但我用心了，请大家多指哈：
慕容(117.36.*.*) 发表于：2009-05-12 11:15:12
有菜鸟群吗？
管理员回复：网站上公布的有群
id=0(220.172.*.*) 发表于：2009-05-07 19:25:37
层和DIV标签有什么区别吗?应该怎么运用他们
管理员回复：层和div指的应该是一个吧
DIV+CSS(115.61.*.*) 发表于：2009-05-03 13:57:45
请问管理员，还有没有QQ群了，这些群都以满了啊a？
管理员回复：暂时没有
深蓝(119.125.*.*) 发表于：2009-04-30 18:26:49
这个float 要在什么情况下才使用的啊。
管理员回复：浮动时使用，比如两列布局时
菜鸟(61.232.*.*) 发表于：2009-04-20 16:51:11
css+div 要是能在多一些入门教程就好了
管理员回复：入门教程挺多的呀，还有视频的
子涵(58.243.*.*) 发表于：2009-02-19 13:14:42
float使用none值时表示对象不浮动，而使用left时，对象将向左浮动，例如本例中的div使用了float:left;之后，右侧的内容将流到当前对象的右侧。使用right时，对象将向右浮动，如果将left的float值设置为right，将使得left对象浮动到网页右侧，而right对象则由于float:left;属性浮动到网页左侧。这样，在动用了简单的float属性之后，二列固定宽度的而已就能够完整的显示出来。这几句，我试了半天才搞明白。不错的网站，不错的老师！以后就在这学习了。
管理员回复：这句话有点难理解，因为id使用了left和right命名，容易理解错误，前天已修改了在id名前加#，应该好理解些了
776w(58.42.*.*) 发表于：2009-01-17 21:36:03
不错不错，赞一个,float使用none值时表示对象不浮动，而使用left时，对象将向左浮动，例如本例中的div使用了float:left;之后，右侧的内容将流到当前对象的右侧。使用right时，对象将向右浮动，如果将left的float值设置为right，将使得left对象浮动到网页右侧，而right对象则由于float:left;属性浮动到网页左侧。这样，在动用了简单的float属性之后，二列固定宽度的而已就能够完整的显示出来。(这段话讲得不是太明白)
管理员回复：不明白？不是有点绕嘴呀
小强(219.128.*.*) 发表于：2009-01-05 11:04:35
教程写的很好，只可惜现在才发现这个网站。
管理员回复：呵呵，说明人气还不够，欢迎对本站提意见
1111(218.28.*.*) 发表于：2008-12-28 22:28:09
太好了，讲的详细又生动。喜欢啊 ,感谢你们啊。
管理员回复：不客气，常来！
Guest(58.221.*.*) 发表于：2008-12-26 11:05:26
请问，我将left层的FLOAT属性改成RIGHT，right层的float属性还是LEFT，与将left层的FLOAT属性改成left，right层的float属性还是right的效果是一样的，就是两个层全在页面的一个左边和右边，为什么会一样，将left层的FLOAT属性改成RIGHT，right层的float属性还是LEFT这样的写法有点不太理解。
管理员回复：这就是css控制页面的强大之处，我们暂且不叫它left层和right层，叫它sidebar和content吧，这样排除了你心里潜意识地将一个层视为左例，一个层视为右列。用float设置两个层的向左浮动或向右浮动，不受它在html中位置的先后影响。不管你把哪个改为left，另一个改为right，它都是一个左，一个右的。
zz(61.184.*.*) 发表于：2008-12-24 16:00:12
在设计第一列里没有“float: left;”语句，是要手工加吗？你的教程做的太好了，找了几天，今天发现了。我要在你的指点下继续学下去。谢谢了。
管理员回复：谢谢呀
淡漠(60.0.*.*) 发表于：2008-12-18 12:01:24
学过一段时间的CSS+DIV，但从没用它做过站，只是用table,我朋友也是新手，到公司用CSS+DIV做出现浏览器不兼容的问题结果被fire了，有些困惑....怎样才能很熟练的做到和table一样完整呢？请高手指教
管理员回复：这个只有多练习，多发现问题，多解决问题，掌握常见的兼容问题解决办法，就会很快掌握的。
天蓬元帅(222.134.*.*) 发表于：2008-12-13 19:21:57
太好了，讲的详细又生动。喜欢啊 ，比我们的老师还好(～ o ～)~zZ。
管理员回复：真的吗，我也可以去做老师了
df(123.103.*.*) 发表于：2008-12-09 11:56:27
很好的教程，很好的网站~
管理员回复：欢迎光顾！！
TT(222.90.*.*) 发表于：2008-12-04 17:12:39
万分感谢。。。。。。我找了很多这方面的东西，但都没有说得这么详细的。。。。您真是咱新手的知音啊！！！Thanks very much!!!!!!!!!!!!!!Good luck with you !!!!!!!!!!!!!
管理员回复：以后常来呀！

我要评论