为什么父元素设置relative,子元素为absolute,定位却根据body(body没有设置position)

来源:4-1 编程挑战

加咖啡喵

2017-03-16 12:41

<div class="login">

 <div class="log-input">

  <input type="text" name=""><label>邮箱/手机号/用户名</label>

  <input type="password" name=""><label>请输入密码</label>

 <div>

 <div>

  <i class="square"></i>

  <span class="next">下次自动登录</span>

  <a href="" class="forget">忘记密码?</a>

 </div>

 <div>

  <i class="entry"></i>

  <i class="register"></i>

 </div>

</div>
.login {
 background: #ebf3fa; 
 width: 250px;
 height: 350px;
 border: 1px solid #bbb;
}
.log-input {
 width: 200px;
 margin:0 auto; 
 }
.log-input input{
 width: 200px;
 height: 30px;
    margin:5px 0;
    position: relative; 
}
.log-input label {
  color: red;
  position: absolute;
  top: 20px;
  z-index: 10;
}
.next {
 font-size: 14px;
}

top:20px;不是根据input 来定位的

写回答 关注

1回答

  • charsandrew
    2017-03-20 15:18:06
    已采纳
    .log-input input和.log-input label

    二者不是父子关系,二者是兄弟关系啊。另外感觉你label标签的用法也有点问题。。。

CSS Sprite雪碧图应用

必学的大型网站实用技术,让你快速掌握CSS Sprite雪碧图技术

47101 学习 · 228 问题

查看课程

相似问题