Как добавить фоновый текст в теги textarea?

Вы знаете, что вы можете добавить изображение в качестве фонового изображения для текстового поля с помощью:Как добавить фоновый текст в теги textarea?

textarea { 
background:#fff url(background.png) no-repeat center scroll; 
}

Как я могу иметь текст (не изображение, ни текст в виде изображения) в качестве фона для текстового поля?

Это не текст, содержащийся в самой текстовой области. Это какой-то текст. Пользователь может писать в текстовом поле, и, как и фоновое изображение, см. Фоновый текст.

CSS2 предпочтительнее, CSS3 и js в порядке.

источник

2013-05-14 Cedric

Не думаю, что вы можете добавить фоновую текст к любому элементу. –

Спасибо за парня, который посоветовал использовать атрибут заполнителя textarea. Это не ответ на вопрос, но это классный трюк, который нужно знать и использовать! (вы можете проверить его там: http: //www.w3schools.com/tags/tryit.asp? filename = tryhtml5_textarea_placeholder) – Cedric

@Cedrice 'placeholder' и' background-image' нигде не связаны и вы упомянули _see background text behind_ в ОП. 'placeholder 'отключается, когда текстовое поле фокусируется. –

Существует грубая сила подход:

<div class="wallpapered"> 
    <div class="background">Some background text...</div> 
    <textarea></textarea> 
</div>

со следующими CSS:

.wallpapered { 
    width: 400px; 
    height: 300px; 
    position: relative; 
    outline: 1px dashed blue; 
} 
.wallpapered textarea { 
    width: inherit; 
    height: inherit; 
} 
.wallpapered .background { 
    position: absolute; 
    top: 0; 
    left: 0; 
    color: gray; 
}

Fiddle

источник

2013-05-14 19:08:54

Как насчет атрибута заполнителя:

<textarea rows="5" cols="30" placeholder="enter optional message"></textarea>

источник

2013-05-14 19:03:34 Mindbreaker

IMO вы можете использовать атрибут placeholder и использовать JS-инструмент для заполнения для неподдерживаемого браузера. Если вы используете jQuery в своем проекте, вы можете использовать что-то вроде http://andrew-jones.com/jquery-placeholder-plugin/ – skeep

@Jason это неверно: http://caniuse.com/#feat=input -placeholder – Mindbreaker

Да, конечно, есть много полигонов-заполнителей, подобных этому: https://github.com/ginader/HTML5-placeholder-polyfill. @Mindbreaker, не уверен, что не правильно, caniuse проверяет, что он вообще не поддерживается в текущих версиях IE. – Jason

Вы можете сделать это с сНом и позиционированием DEMO http://jsfiddle.net/kevinPHPkevin/UXgJD/1/

textarea { 
    position:absolute; 
    left:0; 
    top:0; 
    background: none; 
}

источник

2013-05-14 19:05:11 Vector

Только так я мог думать, чтобы сделать это было бы вручную поместить текст там с фиксированным положением.

JS-fiddle

HTML:

<textarea>This is text</textarea> 
<div class="bgtext"> 
    this is background text 
</div>

CSS для Div (фон текста):

.bgtext { 
    position: fixed; 
    top: 15px; 
    left:10px; 
    opacity: 0.4; /*optional*/ 
}

источник

2013-05-14 19:08:30 sbatson5

Как добавить фоновый текст в теги textarea?

ответ

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