将标签放在输入的顶部

Question

我遇到这个问题，我需要在输入元素的顶部放置标签。下面的图像使用背景图像来做技巧，但我想用标签做。或者跨度可能！我试过用谷歌链接CSS3样式教程但没有发现任何东西。所有这些都是使用图像来放置图标。我想在其中放置带有文本的span / label。

如上图所示如何以图标的放置方式放置跨度或标签。任何想法。

Answer 1

你的意思是这样吗？

Demo

<div>
    <label for="test">L</label>
    <input type="text" id="test" />
</div>

div {
    position: relative;
}

label {
    position: absolute;
    left: 5px;
}

input[type=text] {
    padding-left: 15px;
}