table改div+css

踏雪寻梅 · 发表于 2017-1-12 20:21:43

本帖最后由踏雪寻梅于 2017-1-12 20:24 编辑

　　网页之前一直是使用table嵌套，最近想着改成div+css，但无奈半桶水，这不就遇到点问题。
table原代码如下
[ol]

[url=]
[img][/img]
[/url]

[url=]首页[/url] | [url=]栏目一[/url] | [url=]栏目二[/url] | [url=]栏目三[/url]

[url=]栏目四[/url] | [url=]栏目五[/url] | [url=]栏目六[/url]

[url=]栏目七[/url] | [url=]栏目八[/url] | [url=]栏目九[/url]

[/ol]复制代码
下面是更改成div+css后的代码
[ol]

[url=]>
[img][/img]
[/url]

[url=]首页[/url] | [url=]栏目一[/url] | [url=]栏目二[/url] | [url=]栏目三[/url]

[url=]栏目四[/url] | [url=]栏目五[/url] | [url=]栏目六[/url]

[url=]栏目七[/url] | [url=]栏目八[/url] | [url=]栏目九[/url]

[/ol]复制代码
正常情况下logo和栏目导航是在同一行，也就是head2框架內，但是改成div+css后，栏目导航在框架外了，下面附上css代码
[ol]

.head2 {

background-image:url(head2.png);

background-repeat:repeat-no;

margin:0 auto;

width:1000px;

height:90px;

}

.logo {width:290px;padding-left:10px;}

.banner {width:670px; height:75px; float:left; padding-right:10px;}

.banner li {height:25px;margin:0 auto;}[/ol]复制代码

mix · 发表于 2017-1-12 20:47:49

f12慢慢调试

zjsay · 发表于 2017-1-12 20:52:00

迟了点，现在都h5+CSS3了

mix · 发表于 2017-1-12 20:52:38

给banner ,logo添加display:block,试试

踏雪寻梅 · 发表于 2017-1-12 20:59:00

老狼发表于 2017-1-12 22:02

.logo{float:left;}
已正常，非常感谢

踏雪寻梅 · 发表于 2017-1-12 20:59:51

mix 发表于 2017-1-12 20:52

给banner ,logo添加display:block,试试
感谢解答，但样式还是错误

mix · 发表于 2017-1-12 21:08:02

踏雪寻梅发表于 2017-1-12 20:59

感谢解答，但样式还是错误
猜测应该是float引起的，你参考下http://www.divcss5.com/jiqiao/j406.shtml

ericls · 发表于 2017-1-12 21:36:48

zjsay 发表于 2017-1-12 08:08

迟了点，现在都h5+CSS3了
迟了点现在都 flex 了

zjsay · 发表于 2017-1-12 21:41:05

ericls 发表于 2017-1-12 21:41

迟了点现在都 flex 了
受教了，确实第一次见这个。感谢大神科普

老狼 · 发表于 2017-1-12 22:02:43

.logo{float:left;}