概述
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>input图标设置</title>
<style type="text/css">
div{
width:200px;
height:50px;
background-color:red;
position:relative
}
input{
width:200px;
height:50px;
background-color:gray;
}
span{
width:25px;
height:25px;
background-color:blue;
position:absolute;
top:12.5px;
right:8px;
}
</style>
</head>
<body>
<div>
<input type="text"><span></span>
</div>
</body>
</htlm>
首先新建一个容器包含inout标签,其后紧跟一个span标签然后嵌入图片;
容器设置定位为相对定位(relative),span标签设置为绝对定位(absolute),然后用top/left/bottom/right设置图片位置,span标签会直接显示在input标签的上面。
最后
以上就是傻傻手链为你收集整理的input标签加入图片然后定位最简单的例子的全部内容,希望文章能够帮你解决input标签加入图片然后定位最简单的例子所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复