个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
我正在尝试在 CSS 中进行定位，但我注意到一些让我感到困惑的事情。这可能是个愚蠢的问题……但我无法理解它。
我创建了三个宽度和高度为 50px 且背景颜色不同的 div。当我使用 margin-top 将第三个 div 向上定位 -60px 时，第三个 div 位于第二个 div 的顶部。但是，当我制作第一个和第二个 div 内联元素时，前两个 div 现在都位于第三个 div 之上。
有人可以向我解释一下这个概念吗？
<head>
<style>
<!-- Divs with the same width and height. Second one where both the first two divs are inline below this one. -->
#one{
background-color:red;
width:50px;
height:50px;
}
#two{background-color:blue;
width:50px;
height:50px;
}
#three{background-color:green;
width:50px;
height:50px;
margin-top:-60px;
}
</style>
</head>
<body>
<div id="one">
</div>
<div id="two">
</div>
<div id="three">
</div>
</body>
<head>
<style>
<!-- First two divs are inline -->
#one{
background-color:red;
width:50px;
height:50px;
}
#two{background-color:blue;
width:50px;
height:50px;
}
#one, #two{display:inline-block;}
#three{background-color:green;
width:50px;
height:50px;
margin-top:-60px;
}
</style>
</head>
<body>
<div id="one">
</div>
<div id="two">
</div>
<div id="three">
</div>
</body>
最佳答案
我认为这里有两个问题。一个是通过留下第三个 div display:block 它自然会包裹前两个 div。快速入门 block 与 inline-block see here .
第二部分是你有 margin-top: -60px 而有 height: 50px。负边距基本上是将它向上移动到页面上。这意味着绿色框将比红色框高 10 像素 (-60 + 50 = -10)。
Example Fiddle - 我添加了 margin-left: -5px; 并且您可以看到第三个 div 从第一个 div 的下方窥视。
关于css - 使 div 成为内联元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21492902/
25
4
0
我正在学习 Go，但我无法在任何地方找到这个答案。 Web开发中的文件扩展名是否有任何官方标准？我见过多种约定，例如 .tmpl 和 .gtpl，这是什么？谢谢。 最佳答案 没有固定的标准，但有一些相
关闭。这个问题是opinion-based .它目前不接受答案。 想改善这个问题吗？更新问题，以便可以通过 editing this post 用事实和引文回答问题. 8 年前关闭。 Improve
假设我有两个类(class) Widget ^ | Window 我还有另一个类应用程序: 定义如下 class Application { public: ... private:
按照目前的情况，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
我多年来一直在使用 MySQL，直到去年左右，主要是在较小的项目上。我不确定是语言的性质还是我缺乏真正的教程让我不确定我正在写的东西是否是优化目的和扩展目的的正确方法。 虽然自学 PHP，但我对自己和
我已经多次读到 EJB 是重量级的……但昨晚我正在浏览关于 EJB 的 Java EE 6 教程，它们似乎只是普通的 Java 对象，除了它们可以有像 Stateless 或 Singletons 这
如何使此 SimpleModal 脚本在页面加载时加载而不是单击按钮？谢谢=) Demo 基本模态对话框 对于此演示，SimpleModal 使用此“隐藏”数据作为其内容。您还可以使用标准 HTML
这是 Haskell 中的代码: class Fooable a where foo :: a -> a instance Fooable (a, a) where foo = ...
是否有推荐的方法来测试 Actor 是否使用 be 正确改变了其行为？我更喜欢使用 FSM 的原因之一是因为我可以轻松验证 Actor 是否已更改其行为。我不知道在使用 become/unbecome
我正在构建一个位于“php my admin”中的表，我是在第一次点击其中一个“th”它的 asc 时这样做的，现在我试图在第二次点击时制作 desc ..有什么想法吗？ 阿姆..很多我不记得了抱歉.
考虑以下网页。 我在 Firefox 中打开此页面，打开 JS 控制台并键入以下内容。 > document.getElementById(
如何让自己成为 postgresql 的 super 用户？ 我一直在尝试创建数据库，但我不断收到以下错误: createdb: database creation failed: ERROR: pe
Query没有太大帮助。 如前所述here , PostgreSQL 是 ORDBMS。 here ，它解释了 PostgreSQL 是 RDBMS。 PostgreSQL 是一个 ORDBMS 是什
我已经看到，当在导航元素中使用的链接中垂直/水平居中文本时，将链接设置为 flex 容器会很有用。我没有意识到链接文本实际上可以是一个(单个) flex 元素。我可以看到链接中的 span 元素可以是
我见过很多说明如何找到给定集合的子集的示例，但是您如何将一个集合设为另一个集合的子集？所以集合 B 是集合 A 的子集，这将如何实现？我目前正在使用递归性质的方案，但是这本书只展示了如何列出子集而不是
有些程序会根据其标准输出是否为 tty 来更改其输出。因此，如果您将它们放入管道或重定向它们，输出将与您的 shell 中的不同。这是一个例子: $ touch a b c # when runnin
我正处于项目的开始阶段，到目前为止我一直在使用默认的 MySQL 数据库。 对了，默认的数据库有名字吗？ 我的问题是如何在不删除当前表和创建新表的情况下将现有表更改为 utf-8 和 InnoDB。是
我正在尝试编写一个过滤器来包装数据以遵循 JSON API spec到目前为止，它适用于我直接返回 ActionResult 的所有情况，例如 ComplexTypeJSON。我试图让它在像 Comp
我在 Storyboard 上创建了一个带有一个 UITextField 的自定义 UIViewController。在 viewDidLoad 上，我将 UITextFIeld 设置为 become
我已经看到关于 valueless_by_exception 方法的 cppreference 的以下注释: A variant may become valueless in the followi
我是一名优秀的程序员,十分优秀！