<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>仿豆瓣</title>
<link rel="stylesheet" href="css/css.css">
<style>
*{margin:0px;padding:0px;
}
a{text-decoration: none;
}
li{list-style-type:none;
}
img,input{
border:none;
border:1px solid none;
}
#head{
width:1152px;
height:88px;
border:solid 1px red;
margin:0px auto;
position:relative;
}
}
#head .head-search{
width:272px;height:32px;
border:1px solid #c3c3c3;
position:absolute;
left:195px;top:30px;
color:#e4e4e4;
}
#head .ico{
background: url(../images/icon.png) no-repeat;
display:block;
width:14px;
height:13px;
position:absolute;
top:41px;
left:434px;
}
</style>
</head>
<body>
<div id = "head">
<a class="head-logo" href="#"></a>
<form >
<input type="text" class ="head-search" placeholder="书籍,电影,音乐,小组,小站,成员"/ >
<a class="ico" href="#"></a>
</form>
</div>
</body>
</html>
<a class="ico>标签设定了absolute属性,为什么没有依据他的父元素<form>来定位?而是根据了最外层的<div id="head">这个块元素来定位