Хороший пример реализации «модных» больших текстовых полей ввода?

Question

Хороший пример реализации «модных» больших текстовых полей ввода, таких как найденные на google и tumblr?

На tumblr, как они используются, удается получить вход для возврата назад, с которого находится курсор в поле - в поле конечного ввода для URL.

Answer 1

Вы можете использовать CSS:

input.FancyText { 
    background: url(something) no-repeat; 
    border: none; 
    text-align: right; 
} 

Вы можете увидеть CSS Tumblr, используя Firebug.

Answer 2

input.fat 
{ 
    text-align: right; 
    font-size: 28px; 
} 

Answer 3

Да, просто сделайте так:

input { padding: 10px; font-size: 26px; } 

, и это заставит входные элементы "жирнее".

Answer 4

Как предложил SLaks, вы можете использовать CSS для управления внешним видом текстовых полей ввода. Например, вы можете использовать Firebug, чтобы обнаружить, что CSS использует Tumblr выглядит так:

background-color:#F9F8E4; /* when in focus */ 
background:url("/images/input_bg.png") repeat-x scroll left top #F7FCFF; 
border:1px solid #97B5D2; 
color:#25313C; 
font-family:Georgia,Times,"Times New Roman",serif; 
font-size:28px; /* This probably makes it "fat" as you want */ 
width:480px; 
font:13px 'Lucida Grande',Helvetica,Arial,sans-serif; 
margin:0; 
outline:0 none; 
padding:7px; 

Эти активные стили (которые распределены по нескольким различным правилам). Кроме того, комментарии мои.

Попробуйте установить свойство font-size, чтобы область ввода была «жирной». Попробуйте установить свойство text-align: right, чтобы сделать «поток вправо», как в поле URL.