#html #css #user-interface
#HTML #css #пользовательский интерфейс
Вопрос:
существует ли библиотека JavaScript или css, которая скрывает все границы текстового поля и делает его похожим на то, что вы пишете в строке?
У меня нет примера этого.
Комментарии:
1. нравится это? jsfiddle.net/CuR9G
2. зачем вам нужна библиотека css?
Ответ №1:
Нет необходимости использовать какую-либо библиотеку. Такой результат придаст содержимому редактируемый объем (добавив некоторый стиль, чтобы убрать границу вокруг него при написании):
<span contenteditable style="outline:0px solid transparent;" ></span>
аналогичный результат даст редактируемый div содержимого, однако его можно оформить лучше, потому что это блок
<div contenteditable style="outline:0px solid transparent;" ></div>
Оно не имеет границ, и вы можете написать в нем что угодно.
Ответ №2:
Простой css должен работать
<style>
input {
background-color: #fff; // your doc background color
border: 0px;
контур: отсутствует;
}
Комментарии:
1. если содержимое будет отправлено (форма), то я думаю, что этот вариант является лучшим.
2. Вам также следует рассмотреть возможность скрытия объекта outline.
Ответ №3:
Я считаю, что хорошим решением является использование ответа @Mark, но с использованием класса css:
в CSS:
.inline-input {
background-color: #fff; // your doc background color
border: 0px;
display: inline;
}
/* and if you also don't want the outline when input get focus */
.inline-input:focus {
outline: none;
}
в HTML:
Some text before <input type="text" class="inline-input" name="xxx"/> some text after
Ответ №4:
Если вы используете chrome, поле по-прежнему выделяется при выборе, поэтому, хотя вокруг поля нет границы, квадратное выделение создает впечатление, что оно есть, когда поле находится в фокусе.