Link inside of input tag

来源:互联网 发布:思迅软件多少钱 编辑:程序博客网 时间:2024/05/22 10:33

http://stackoverflow.com/questions/6959484/link-inside-of-input-tag

You have two options.

  1. Place the image as a background of the input, but this won't be clickable.
  2. Absolutely position the element over an input.

1:

.myInput { background:url(path/to/img.jpg) 5px 5px no-repeat; }

2:

HTML

<div class="inputContainer">    <input class="myInput" type="text" name="myInput" id="myInput" />    <a href="#" class="inputImg"><img src="#" /></a></div>

CSS

.inputContainer { position:relative; }.myInput { padding-left:25px; /* This will move the text from under the image */ } .inputImg { left:5px; position:absolute; top:5px; z-index:5; }

You'll need to play with the position and values depending on your input size, image size and general placement, but that should do what you want.


0 0
原创粉丝点击