html5中文学习网

您的位置: 首页 > 网页制作 > css教程 » 正文

两个div在同一行且不换行的两种方法_Div+CSS教程_CSS_网页制作

[ ] 已经帮助:人解决问题
点评:这篇文章主要介绍了两个div在同一行,两个div不换行的两种实现方法,有不知道的朋友可以参考下
方法一: ScKHTML5中文学习网 - HTML5先行者学习网

复制代码
代码如下:
ScKHTML5中文学习网 - HTML5先行者学习网
<div style="display:inline"> ScKHTML5中文学习网 - HTML5先行者学习网
<div id="div1" style="float:left">div1 content</div> ScKHTML5中文学习网 - HTML5先行者学习网
<div id="div2" style="float:left">div2 content</div> ScKHTML5中文学习网 - HTML5先行者学习网
</div> ScKHTML5中文学习网 - HTML5先行者学习网
ScKHTML5中文学习网 - HTML5先行者学习网
上面的div1和div2就会在同一行显示。。。(此方法一般都会有效的) ScKHTML5中文学习网 - HTML5先行者学习网
ScKHTML5中文学习网 - HTML5先行者学习网
方法二: ScKHTML5中文学习网 - HTML5先行者学习网

复制代码
代码如下:
ScKHTML5中文学习网 - HTML5先行者学习网
<div id="div1" style="float:left">div1 content</div> ScKHTML5中文学习网 - HTML5先行者学习网
<div id="div2" style="clear:both">div2 content</div> ScKHTML5中文学习网 - HTML5先行者学习网
ScKHTML5中文学习网 - HTML5先行者学习网
这种方法有时候会不起作用,好像在引入别的js框架中使用部分会出现问题。
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助