html - HTMLで非表示のテキストフィールドを作成しますか？

Question

上司が提供したデザインモックアップにhtmlコードを挿入しようとしていますが、美学の一部（たとえば、検索バーの形状）は少し奇妙で複雑です。簡単な解決策として、検索バーの画像の上にテキストフィールドを配置するだけだと思いましたが、機能させることができません。

誰かが画像の上にテキストフィールドを重ねて、見えないようにしながら機能させる方法を提案できますか？

Answer 1

不可視性に関する限り、このCSSを入力に追加します。

input {
    background: transparent;
    border: none;
}

これが実際に動作していることを示すこのjsFiddleを確認してください。入力の配置に関しては、通常どおり処理できるはずです。