个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
我有以下 CSS/HTML block :
<html>
<head>
<title>{CODE} Pink</title>
<style>
.leftLogo {
float: left;
border: black solid;
background-color: black;
color: white;
font-family: Courier, Courier New;
}
.rightLogo {
float: right;
border: black dashed;
background: pink;
color: black;
}
.logo
{
height: 50px;
line-height: 50px;
width: 200px;
text-align: center;
vertical-align: middle;
font-size: 3em;
}
</style>
</head>
<body>
<div class="leftlogo logo">{CODE}</div>
<div class="rightlogo logo">PINK</div>
</body>
</html>
它目前正在做的是:
我希望它做的是:
我知道我可以通过位置来做到这一点，但是这样做的最佳方式是什么，以便两者在各种情况下都保持相邻？
最佳答案
更改 .rightlogo class 的代码以反射(reflect)这一点:
.rightLogo {
float: left;
}
而不是现在的样子:
.rightLogo {
float: right;
}
注意:另外，请注意类的大小写。我注意到在您的 CSS 中，您使用了 .leftLogo，但在您的 HTML 中，您使用了 .leftlogo。我不确定浏览器的要求有多严格才能如此严格，但我不会把它放在 IE 之后把事情搞砸。
结果:
.leftLogo {
float: left;
border: black solid;
background-color: black;
color: white;
font-family: Courier, Courier New;
}
.rightLogo {
float: left;
border: black dashed;
background: pink;
color: black;
}
.logo
{
height: 50px;
line-height: 50px;
width: 200px;
text-align: center;
vertical-align: middle;
font-size: 3em;
}<div class="leftLogo logo">{CODE}</div>
<div class="rightLogo logo">PINK</div>关于html - 如何让两个 div 相互粘附？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31976823/
25
4
0
我是一名优秀的程序员,十分优秀！