我正在构建这个登录html文件，代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test</title>
<link type="text/javascript" herf="jquery.js"/>
</head>
<body>
<div id="div1">
<input placeholder="Username:" class="inputter" id="inputter1"/>
<input placeholder="Password:" class="inputter" id="inputter2"/>
<button onclick="" id="button1">Submit</button>
</div>
</body>
<style type="text/css">
body{
-webkit-font-smoothing: antialiased;
visibility: visible;
text-decoration: none;
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
box-sizing: border-box;
overflow: hidden;
-webkit-tap-highlight-color: transparent;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(90deg, rgb(243, 72, 104) 20.1814%, rgb(242, 71, 104) 20.1814%, rgb(158, 0, 236) 80.1832%);
}
</style>
</html>
当我尝试在PC、iPhone和Andriod web explorer上打开它时，我发现它只能在PC explorer上正确显示，其他都没有背景渐变。请告诉我为什么和如何修理它。谢谢.
从正文中删除position：absolute；。
null
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test</title>
<link type="text/javascript" herf="jquery.js"/>
</head>
<body>
<div id="div1">
<input placeholder="Username:" class="inputter" id="inputter1"/>
<input placeholder="Password:" class="inputter" id="inputter2"/>
<button onclick="" id="button1">Submit</button>
</div>
</body>
<style type="text/css">
body{
-webkit-font-smoothing: antialiased;
visibility: visible;
text-decoration: none;
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
box-sizing: border-box;
overflow: hidden;
-webkit-tap-highlight-color: transparent;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(90deg, rgb(243, 72, 104) 20.1814%, rgb(242, 71, 104) 20.1814%, rgb(158, 0, 236) 80.1832%);
}
</style>
</html>