html - 是否会在同一行显示 div 是否有任何类?

标签 html css

我想使用样式显示内联 block 和宽度在同一行上显示三个 div,除此样式外,任何 css3 类都可用。

代码:

<div id="1" style="display:inline-block;width:10%"> </div>
<div id="2" style="display:inline-block;width:10%"> </div>
<div id="3" style="display:inline-block;width:10%"> </div>

最佳答案

不确定你在问什么,但如果你想使用类而不是内联样式并使 div 对齐,你可以使用这个 css 来实现:

HTML

<div id="1" class="inlineDivs"> </div>
<div id="2" class="inlineDivs"> </div>
<div id="3" class="inlineDivs"> </div>
<div class="clearfix"></div>

CSS

.inlineDivs{
  display:inline-block;
  width:33%;
  float:left;
  background:deepskyblue;
  min-height:200px;
  border-right:1px solid black;
}

通常,在一些 float div 之后我也会使用一个 clearfix div。

在这里查看它的外观:http://codepen.io/anon/pen/LVvVER

关于html - 是否会在同一行显示 div 是否有任何类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31958258/

相关文章:

html - IE 8 CSS 悬停在输入元素问题上

html - 禁用 body 滚动

jquery - IE7 在悬停之前不会从导航中移除事件状态

HTML5 音频文件无法在 Safari 中加载

javascript - 模态对话框 (showModalDialog) 中的对象在 ie8 中不支持 100% 宽度。解决方法?

html - 组合 CSS 语法

php - 包含 2 列的框和固定文本长度以匹配列宽

html - 如何增加页眉的宽度以匹配整个页面的宽度?

javascript - Adblock active 然后不要在新标签页中打开超链接

html - 如何在 float 元素上设置百分比的水平填充?