如何使相对布局在水平方向添加元素？

-2

为什么在一列中垂直添加相对元素。是否可以使元素水平显示而不是垂直显示？像一排而不是一列。如何使相对布局在水平方向添加元素？

2014-05-09 Ankit Mundada

如果有人向下分级的问题，至少告诉什么错？ –

在提出问题之前，您会因为没有进行搜索而陷入低谷。这是一个相当基本的问题。如果您将鼠标悬停在downvote按钮上，其中一个标准是“不显示任何研究工作”。如果您无法通过谷歌或其他搜索找到解决方案，请在您的答案中包括这些和您的搜索条件。 – indivisible

将位置设置为相对并不一定以水平放置和垂直放置的顺序来决定顺序。这是块级和内联元素之间的区别。

如果可用宽度允许，块级元素（例如div）默认显示为新行，inline元素（例如span）出现在同一行上。

可以在effect here

看到这一点，你可以通过在你的CSS设置它覆盖为元素的默认display。

More on Block level elements from MDN

“块级” 是HTML（超文本标记语言）元件的分类，作为对比用 “内联” 的元素。块级元素可能仅出现在元素中。他们最重要的特征是它们通常在元素之前和之后通过换行符进行格式化（从而创建内容为独立块的内容）。也就是说，它们占据了容器的宽度。

More on Inline elements

“内联” 是HTML元素的分类，与 “块级” 元素对比。内联元素可以出现在块级或其他内联元素中。他们占用他们内容的宽度。内联元素和块级元素之间的差异包括格式化，默认情况下，内联元素不以新行开始。

来源

2014-05-09 10:15:47 SW4

Thankx很多伴侣！这对我帮助很大。 –

@ user274951没问题，不要忘记标记为已接受，无论哪个答案最有帮助 - 无论是这个还是另一个 – SW4

我相信你在找的是display:inline-block的CSS属性。默认情况下，使用display:block来显示元素，这是它们显示为“列”的原因。

以此为例。

HTML：

<div>Relative Div 1</div> 
<div>Relative Div 2</div> 
<div>Relative Div 3</div>

CSS：（增加了一些线条，使为它做什么它更可见）

div { 
    width: 50px; 
    height:50px; 
    background:#ff0000; 
    margin:5px; 
    position:relative; 
    display: inline-block; 
}

WORKING DEMO

来源

2014-05-09 10:19:36

你问题不是很清楚......也许你的元素是默认显示（display：block）。你可以尝试在你的元素中放置display：inline-block。

例如：

<style> 
    .whatever{display:inline-block;} 
    </style> 

    <div class="whatever">....</div> 
    <div class="whatever">....</div> 
    <div class="whatever">....</div> 
    <div class="whatever">....</div>

来源

2014-05-09 10:21:26

如何使相对布局在水平方向添加元素？

回答

相关问题