<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8">
<!-- 视口设置:用于移动浏览器显示效果设置 -->
<meta name="viewport" content="width=device-width,initial-scale=1" />
<!-- 实现响应式开发必须配置,且必须在<head>内前三行 -->
<script type="text/javascript">
function gey() {
var a=document.getElementById("1");
var put=document.createElement("li");
var ii=document.getElementsByName("inputInformation");
put.style.textAlign="right";
var img=document.createElement("img");
img.style.textAlign="right";
img.src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1801304218,2614719406&fm=26&gp=0.jpg";
img.width=22;
var d=ii.values();
put.innerText=d;
put.appendChild(img);
a.appendChild(put);
}
</script>
<title>zuoye</title>
<link type="text/css" rel="stylesheet" href="Scripts/bootstrap.bundle.min.js" />
</head>
<body>
<div class="container" style="background-color:dodgerblue">
<div class="row" >
<div class="col-12">
<div style="text-align:center">
<img src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2527619661,1213550460&fm=26&gp=0.jpg" width="20" class="img-fluid" />
<span style="color:lightpink">苏烟呀</span>
</div>
</div>
</div>
<div style="margin:0px 20px 5px 20px;height:300px;background-color:aliceblue;">
<ul style="list-style:none" id="1">
<li><img src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2527619661,1213550460&fm=26&gp=0.jpg" width="22" class="rounded-circle" />有什么事吗？</li>
<li style="text-align:right">为什么我对线对不过你？<img src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1801304218,2614719406&fm=26&gp=0.jpg" width="22" class="rounded-circle" /></li>
<li><img src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2527619661,1213550460&fm=26&gp=0.jpg" width="22" class="rounded-circle" />。。。可能你比较菜吧</li>
</ul>
</div>
<div style="text-align:center">
<form class="form-inline" action="Ui-2.jsp" method="post">
<input type="text" id="22" style="width:80%" name="inputInformation"/>
<input class="form-control-range" type="button" value="发送(s)" onclick="gey()" />
</form>
</div>
</div>
<div class="container" style="background-color:black;margin:0px 20% 0px 20%">
<div class="row">
<div class="col-12" style="line-height:30px;text-align:center">
<span style="color:aliceblue">被对线打爆了.</span>
</div>
</div>
</div>
</body>
</html>已解决