Изменить позицию фокуса курсора внутри текстового поля css

Question

Изменить позицию фокуса курсора внутри текстового поля css

0

Как изменить начальную позицию курсора текстового поля? Я хочу, чтобы мой вводный курсор начинался в самом начале текстового поля. В настоящее время он начинается со средней площади.

Вот css для моей текстовой области.

  <input id="probleminput" class="form-inline" type="text" style="display: inline;"></input>

   #probleminput {
        position: absolute;
        display: none;
        top: 448px;
        left: 185px;
        height: 94px;
        width: 370px;
        border: 1px solid;
        outline: none;
        font-size:20px;
        font-family: Verdana;
        background:transparent;
        background-repeat: repeat;
        margin: 1px 1px 1px 5px;
        color: cyan;
    }

Могу ли я изменить что-то выше, чтобы сделать фокус текста курсором с самого начала? Надеюсь, мой вопрос не был двусмысленным. Благодарю!

Htlcs 16 апр. 2014, в 21:39

Источник

0

Да. Я применяю это для ввода. Я отредактировал свой код вопроса.
Htlcs 16 апр. 2014, в 19:15
0

В настоящее время все работает отлично. Я могу написать текст и все, но это начинается с середины текстовой области. Я хочу, чтобы мой ввод текста начинался с начала текстовой области.
Htlcs 16 апр. 2014, в 19:17
0

попробуйте использовать <textarea> вместо <input>, чтобы это исправить.
krozero 16 апр. 2014, в 19:20

Показать ещё 1 комментарий

Теги:

jquery

html

css

2 ответа

0

Если вы хотите иметь более одной строки текста, используйте вместо этого <textarea>. Текстовые поля ввода, как правило, для одной строки, поэтому вертикально центрирует ваш текст.

Изменить: вы можете сохранить свой CSS так же и внести следующие изменения HTML:

<textarea id="probleminput" class="form-inline" style="display: inline;"></textarea>

Kylok 16 апр. 2014, в 16:57

0

Большое спасибо. Но как мне избавиться от значка перетаскивания в текстовой области внизу справа, состоящего из триангулированных точек? Я не хочу этого. Также есть способ изменить полосу прокрутки, как есть способ стилизовать ее и сделать ее более красивой, чем обычную полосу серого цвета
Htlcs 16 апр. 2014, в 19:28
1

Чтобы отключить изменение размера, добавьте resize:none; на ваш CSS для текстовой области. Стиль полосы прокрутки немного сложнее; разные браузеры по-разному отображают полосы прокрутки, и не существует хорошего способа их стилизации, который работает во всех браузерах, кроме использования плагина, который их «подделывает», например perfect-scrollbar . Другой вариант - сделать текстовую область достаточно большой, чтобы никому не понадобилось прокручивать и добавлять overflow:hidden; в CSS, который не будет отображать полосы прокрутки, если введено слишком много текста.
Kylok 16 апр. 2014, в 19:36
0

большое спасибо, приятель! ценю твою помощь
Htlcs 16 апр. 2014, в 19:40

Показать ещё 1 комментарий

Ещё вопросы

Да. Я применяю это для ввода. Я отредактировал свой код вопроса.
В настоящее время все работает отлично. Я могу написать текст и все, но это начинается с середины текстовой области. Я хочу, чтобы мой ввод текста начинался с начала текстовой области.
попробуйте использовать <textarea> вместо <input>, чтобы это исправить.
Большое спасибо. Но как мне избавиться от значка перетаскивания в текстовой области внизу справа, состоящего из триангулированных точек? Я не хочу этого. Также есть способ изменить полосу прокрутки, как есть способ стилизовать ее и сделать ее более красивой, чем обычную полосу серого цвета
Чтобы отключить изменение размера, добавьте resize:none; на ваш CSS для текстовой области. Стиль полосы прокрутки немного сложнее; разные браузеры по-разному отображают полосы прокрутки, и не существует хорошего способа их стилизации, который работает во всех браузерах, кроме использования плагина, который их «подделывает», например perfect-scrollbar . Другой вариант - сделать текстовую область достаточно большой, чтобы никому не понадобилось прокручивать и добавлять overflow:hidden; в CSS, который не будет отображать полосы прокрутки, если введено слишком много текста.
большое спасибо, приятель! ценю твою помощь

j08691 · Accepted Answer · 2014-04-16T16-26-00.000Z

Не устанавливайте высоту, а используйте прокладку.

Пример jsFiddle

 #probleminput {
     position: absolute;
     display: none;
     top: 448px;
     left: 185px;
     width: 370px;
     border: 1px solid;
     outline: none;
     font-size:20px;
     font-family: Verdana;
     background:transparent;
     background-repeat: repeat;
     margin: 1px 1px 1px 5px;
     color: cyan;
     padding: 0 0 94px;
 }

Но на стороне примечания, вы, вероятно, хотите вместо элемента textarea.