Использование изображения в качестве входного текста

Возможно, это простой вопрос, но я искал его в течение долгого времени и не повезло. Мне просто нужно использовать изображение как вход type=text, вместо того чтобы использовать белый ящик, как обычно. Я попытался использовать background-image, но тогда белый все еще там, только он имеет фоновое изображение. Мне не нужна белая коробка. Как я могу это сделать?Использование изображения в качестве входного текста

источник

2014-01-23 ishwr

Можете ли вы объяснить свой вопрос более четко, пожалуйста, – SaturnsEye

Как это может быть «текст» вход без пользователей будучи в состоянии добавить текст? Если это просто изображение, где они печатают? – WreithKassan

Итак, вы хотите, чтобы текстовое поле имело фон изображения вместо простого белого? – stackErr

Как это:

HTML

<label for="test">Label here</label> 
<input type="text" name="test" id="test" placeholder="placeholder text" />

CSS

input[type=text] { 
    background:url(http://placekitten.com/200/200) no-repeat 0 0; 
    border:0 none; 
    padding:4px 10px; 
    color:#fff; 
}

JSFiddle Demo

источник

2014-01-23 15:25:09

спасибо! Мне просто нужно добавить цвет фона в прозрачный. благодаря! – ishwr

+1 U возился со скрипкой, и проблема заключалась в том, что у вас было 4px 4px в конце URL-адреса изображения, что давало вам преимущество. Сделав это 0 0, Ник Р запустил это пространство. – WreithKassan

Это то, что вам нужно?

http://jsfiddle.net/HU8EE/

HTML

<div class="image">Text text text text text text text</div>

CSS

.image { 
    width:400px; 
    height:200px; 
    background-image:url(http://3.bp.blogspot.com/-HX2iaDPwkhs/T6IEBoiufuI/AAAAAAAAAyQ/dtC9Sr268_k/s1600/doodle-525-cloud.jpg); 
}

источник

2014-01-23 15:19:28 SaturnsEye

к сожалению нет. Мне нужно использовать изображение в качестве входного текста. – ishwr

Что это значит? вы не можете просто набирать изображение, вам нужно создать что-то, чтобы набрать его. – SaturnsEye

Если я вас правильно понимаю, это может быть решением. Применение фонового изображения в поле ввода текста: fiddle

HTML:

<textarea rows="10" cols="10" class="input">default text</textarea>

CSS:

.input { 
    background-image: url(http://www.placehold.it/10x10); 
}

источник

2014-01-23 15:22:40 badAdviceGuy

Использование изображения в качестве входного текста

ответ

Смежные вопросы