Шаблон:Inputbox

Приклад тексту, який видно лише на сторінці шаблону. 

Документація шаблону[перегляд] [редагувати] [історія] [очистити кеш]

Використання

{{Inputbox}} виводить короткий рядок тексту так, наче він перебуває в полі вводу. одним із прикладів використання є відтворення (емуляція) поля опису редагування.

Код

{{Inputbox|/* Заголовок */ Мій опис редагування}}

Дає

/* Заголовок */ Мій опис редагування

Примітки

• Перед шаблоном можна додавати стандартні відступи, як для тексту, за допомогою «:», «*», або «:*».
• Шаблон використовує візуальний формат для «messagebox» у Вікіпедії (monobook: чорний текст на білому тлі, 80% ширини екрану), без пробілів (через nowrap).
• Якщо Ви використаєте дуже довге речення, перенесення рядка тексту не буде. Натомість текст виходитиме за межі екрану і з'явиться горизонтальний повзунок для всієї сторінки. Можна змінити за допомогою параметрів, але тоді вигляд такого поля все одно відрізнятиметься від стандартного поля для опису редагування (у якому є можливість прокрутки, але відсутній повзунок.
• Так само як і в інших шаблонах, якщо Ваш текст містить знак рівності, Вам доведеться скористатися параметром «1=», або взяти весь текст чи потрібну його частину в теги <NOWIKI>...</NOWIKI>.
• Будь ласка, не підставляйте (через subst:) цей шаблон.

Параметри

Стандартні значення зазвичай беруться з class=messagebox.

overflow

Як текст поводитиметься, якщо його довжина перевищує довжину поля. Можна приховати зайвий текст через «hidden» (довжина поля залишається сталою, а текст, який її перевищує, стає прихованим), уможливити прокрутку «scroll» (знизу поля з'явиться горизонтальний повзунок для прокрутки, скориставшись яким можна буде побачити решту тексту), або зробити його видимим через «visible» (поле розширюватиметься настільки, наскільки буде потрібно, щоб умістити довгий текст [працює в Internet Explorer та Opera, за деякими відгуками може не працювати у Firefox]). (стандартно використовується значення «visible») – Див. також приклади.

width

Ширина поля, може мати значення «50%», «20em», «40ex» тощо (стандартно використовується «80%») — бажано використовувати відносні значення (такі як %, em, та ex) замість тих, які залежать від пристрою (пікселі).

style

Дозволяє додавати через крапку з комою інші CSS-стилі у форматі «назва:значення; назва:значення; тощо» (стандартно цей параметр є порожнім) — «width» та «overflow» теж можна, за бажання, прописати тут.

Приклади

Код

{{Inputbox|width=20%|Це поле надто мале для мене! Як я можу в нього поміститись?}}

Дає

Це поле надто мале для мене! Як я можу в нього поміститись?

Це поле, попри встановлене значення ширини, розширюється, щоб умістити весь введений текст (це стандартне значення overflow=visible; не працює в деяких браузерах).

---

Код

{{Inputbox|width=20%|overflow=hidden|Це поле надто мале для мене! Як я можу в нього поміститись?}}

Дає

Це поле надто мале для мене! Як я можу в нього поміститись?

Це поле зберігає встановлену ширину 20%, а зайвий текст приховує.

---

Код

{{Inputbox|width=20%|overflow=scroll|Це поле надто мале для мене! Як я можу в нього поміститись?}}

Дає

Це поле надто мале для мене! Як я можу в нього поміститись?

Це поле зберігає встановлену ширину 20%, але додає горизонтальний повзунок, щоб прихований текст можна було прочитати.

---

Код

{{Inputbox|style=background-color:yellow; color:red; width:40%;|Мої очі! Мої очі!}}

Дає

Мої очі! Мої очі!

Це поле використовує стилі, прописані у вільній формі, де можна вказати що завгодно, якщо це не виходить за межі можливостей CSS, у тому числі тут можна задати й ширину поля.

---

Повноцінний приклад із прихованою таблицею

Правила безпеки вимагають, щоб поля паролів приховували свій вміст.

Ім'я користувача:	Piramidion
Пароль:	********

Технічне

Оскільки дійсні <FORM><INPUT> не дозволені у вікірозмітці, вигляд таких полів доводиться емулювати. Код CSS розроблений так, щоб уникати жорсткого кодування кольорів і розмірів, і його треба змінювати з обережністю, з урахуванням таких міркувань:

• CLASS="messagebox" бере кольори й ширину для поля з теми оформлення користувача. Тому, навіть якщо кольорова схема — це білий текст на чорному тлі, наше емульоване поле вводу виглядатиме відповідно (замість використання чорного тексту на білому тлі, що виглядало б у такій темі оформлення неоковирно).
• "border:0.15em;" використовує неабсолютну ширину рамки, яка відтворюватиметься приблизно однаково на будь-якому екрані (на відміну від жорсткої ширини в пікселях).
• "inset" дещо змінює вигляд "messagebox", запозичений із відповідного батьківського елемента, щоб забезпечити приблизне 3D-зміщення поля, яке відтворюється кожним браузером відповідно до цього значення.
• "padding:0.1em;" потрібно для уникнення «приклеювання» тексту до країв у браузерах, які чітко дотримуються значення «padding», і тут, як і у всіх інших випадках, краще використовувати відносне значення em замість пікселів. (Зокрема, в браузері Opera, значення "padding:0" робитиме саме те, що прописано, тобто відступу від країв не буде).
• "margin:0.1em;" призначено для уникнення «приклеювання» декількох полів одне до одного; теж слід використовувати відносне значення em замість пікселів.

Результат не є ідеальним полем вводу у форматі 3D, але мав би давати непогане уявлення, про що йдеться, незалежно від браузера, налаштувань кольорів чи роздільної здатності екрана пристрою.