CSS textarea — добавляем фон в поле ввода textarea

Опубликовано: 07-08-2010 | Автор : Vch54ti

0

css_texarea_01

Пару раз у меня спрашивали как сделать подобную надпись в поле ввода textarea, по этому я решил опубликовать решение здесь.

На самом деле — все очень просто — такая надпись делает как фоновое изображение для поля ввода textarea посредством CSS. Ниже показываю пример кода CSS для реализации такой задачи:

textarea#styled {

width: 600px;

height: 120px;

border: 3px solid #cccccc;

padding: 5px;

font-family: Tahoma, sans-serif;

background-image: url(bg.gif);

background-position: bottom right;

background-repeat: no-repeat;

}

По сути выше указан практически тот же самый код, что я использую у себя на этом блоге — по этому в качестве примера можете посмотреть texarea в форме отправки комментариев.

Дополнительно можно еще добавить надпись «Введите свой комментарий», которая будет исчезать когда произойдет клик на форму texarea:

<textarea name="styled-textarea" id="styled" onfocus="this.value=''; setbg('#e5fff3');" onblur="setbg('white')">Введите свой комментарий...</textarea>

Так что, как видите — все сводится к тому, что вешается фоновое изображение на форму texarea… Фоновое изображние думаю при желании — найдется ;)

P.S. спонсор написания данной статьи сайт code-guru.ru — статьи по программированию и примеры программного кода. И помните — везде свой формат файлов.

Спасибо Вам за добавление статьи "CSS textarea — добавляем фон в поле ввода textarea" в:

Если данная публикация вам понравилась, предлагаю вам подписаться на получение материалов centavrus-opti.ru через RSS ленту, и при желании присоединиться ко мне в Twitter