javascript - 如何将边距设置为两个相邻元素中的一个元素？

Question

这是我的代码:

.fold1_content .logo{
  border: 1px solid;
  display: inline-block;
  height: 80px;
  width: 80px;
  text-align: center;
}
.fold1_content .title{
  display: inline-block;
  margin-right: 5px;
  font-size: 60px;
}

<div class="fold1_content">
  <div class="logo">logo</div>
  <div class="title">         
    title   
  </div>
</div>

我要做的就是设置.title{margin-top: 30px;}。我的意思是我想把这个标题降低一点。我怎样才能做到这一点？

目前，padding 和 margin 都不会只影响一个元素。

Answer 1

您必须使用vertical-align属性。了解更多vertical-align property

.fold1_content .logo{
  border: 1px solid;
  display: inline-block;
  height: 80px;
  width: 80px;
  text-align: center;
}
.fold1_content .title{
  display: inline-block;
  margin-right: 5px;
  font-size: 60px;
  margin-top: 30px;
  vertical-align: top;
}

<div class="fold1_content">
  <div class="logo">logo</div>
  <div class="title">
    title
  </div>
</div>