Як змінити колір заміщуваного тексту поля форми

З цього туторіалу Ви дізнаєтеся, як змінитиколір тексту, що заміщає (placeholder text color) поля форми.

Заміщаючий текст поля форми містить підказку, яка вказує очікувані дані у полі. Це може бути приклад або короткий опис очікуваної інформації. Коротка підказка відображається у полі до того, як користувач почне вводити дані.

За замовчуванням текст, що заміщає світло-сірий (таким його відображають браузери). Для того щоб додати до цього тексту стилі користувача, Вам потрібно буде використовувати браузерні префікси для властивостей CSS.

Щоб змінити колір тексту, що заміщує, виконайте такі інструкції:

Складіть код відповідно до наступної інформації (зверніть увагу, що Вам необхідно додати один і той самий код 4 рази для кожного браузерного префікса):

форми

Наступний код змінить колір заміщуючого тексту для текстової області (text area) (де, як правило, вводиться основне повідомлення контактної форми):

тексту

тексту

Виберіть файл, до якого Ви додаєте код. Ви можете додати його до будь-якого файлу CSS вашого сайту, але ми приготували для Вас список файлів, до яких рекомендується додавати правила CSS для різних типів движків сайтів:

Шаблони CMS:
  • Теми WordPress (Теми WooCommerce/Jigoshop) /wp-content/themes/themeXXXXX/style.css
  • Шаблони Joomla (шаблони VirtueMart) /templates/themeXXXX/css/template.css
  • Теми Drupal /sites/all/themes/themeXXX/css/style.css
  • Шаблони Web (HTML5) /css/style.css
Шаблони E-commerce:
  • Теми Magento /skin/frontend/default/themeXXX/css/styles.css
  • Теми PrestaShop /themes/themeXXXX/css/global.css
  • Теми OpenCart/catalog/view/theme/themeXXX/stylesheet/stylesheet.css
  • Теми ZenCart /includes/templates/themeXXX/css/stylesheet.css
  • Шаблони osCommerce /css/stylesheet.css
  • Шаблони Shopify style.css.liquid

  • Збережіть зміни та завантажте файли CSS на ваш сервер.

    Ви також можете ознайомитися з детальним туторіалом нижче: