Emojis по тексту ввода

Ответ 1

Я понял, как изменить значок маркера в браузерах Webkit.

По сути, вы используете собственный шрифт (demo).

• Перейдите на Fontello или эквивалентный сайт.
• Выберите или загрузите значок.
• Выберите вкладку "Настройка кодов".
• Измените назначение символа на U+ "2022", чтобы заменить символ маркера.
• Загрузите веб-шрифт.

• Включите файлы шрифтов на своем сайте и включите следующую css (обратите внимание, что 0000 будет меняться в зависимости от назначения глифа и глифа)

  /* Use the css below to change the password input symbol */
  @font-face {
    font-family: 'fontello';
    src: url('./font/fontello.eot?0000');
    src: url('./font/fontello.eot?0000#iefix') format('embedded-opentype'),
    url('./font/fontello.woff?0000') format('woff'),
    url('./font/fontello.ttf?0000') format('truetype'),
    url('./font/fontello.svg?0000#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
  }
  
  input[type="password"] {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;
  
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
  
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
  
    /* add spacing to better separate each image */
    letter-spacing: 2px;
  }
  

Полные инструкции со скриншотами находятся здесь.

Ответ 2

Из того, что я мог найти, это не очень хорошая идея. Поскольку браузер отображает их изначально, если вы создадите обходной путь JavaScript, вы, скорее всего, поставите под угрозу безопасность, сломаете автозаполнение и т.д.

Нашел отсюда: сменить пароль char в HTML.

Хотя это отличается от того, что вы хотите сделать, здесь кто-то, кто делает базовый стиль CSS в поле ввода пароля. Извините, это не так страшно, как то, что вы пытаетесь сделать: Поля по стилю в CSS.