::-moz-placeholder

No estándar
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

Nota: El pseudo-elemento ::-moz-placeholder fue creado como sustituto de la pseudo-clase :-moz-placeholder que fue depreciada a partir de la versión de 19 de Firefox.

Resumen

El  pseudo-elemento ::-moz-placeholder sirve para seleccionar cualquier elemento de un formulario que esté mostrando un  marcador de posición de texto (placeholder text) . Permite a los desarrolladores web y a los diseñadores de tema personalizar la apariencia de estos elementos, cuyo estilo por defecto es de color gris claro. Puede que no funcione correctamente si se cambia el color de fondo de los campos de los formularios para que sean, por ejemplo, de un color similar, así que en ese caso se puede usar este pseudo-elemento para cambiar el color del marcador de posición de texto (placeholder text).

Ejemplo

En este ejemplo se da estilo al marcador de posición del texto (placeholder text) haciendo que el color del texto sea verde (green).

Contenido HTML

<input id="test" placeholder="Placeholder text!">

Contenido CSS

input::-moz-placeholder {
  color: green;
}

Obtendremos el siguiente resultado:

Especificaciones

No es parte de ninguna especificación.

Compatibilidad con los distintos navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Soporte básico ? 19.0 (19.0)[1] ? ? ?
Característica Android Firefox Mobile (Gecko) Firefox OS IE Phone Opera Mobile Safari Mobile
Soporte básico ? 19.0 (19.0)[1] ? ? ? ?

[1] Firefox aplica un estilo por defecto de  opacity: 0.54 al marcador de posición del texto (placeholder). Ver error 556145. La mayoría de los demás navegadores importante no comparten este estilo ni para el pseudo-elemento ni para la pseudo-clase.

La implementación previa en el motor Gecko era como la pseudo-clase  :-moz-placeholder. Ver error 737786.

Ver además

Temas relacionados
  1. CSS
  2. Referencia CSS
  3. CSS Selectors
  4. Guías
    1. Usando la pseudo-clase :target en selectores
  5. Basic Selectors
    1. Selectores de tipo
    2. Selectores de clase
    3. Selectores de ID
    4. Selectores universales
    5. Selectores de atributo
  6. Combinators
    1. Selectores de hermanos adyacentes
    2. Selectores de hermanos generales
    3. Selectores de hijo
    4. Los selectores descendientes
    5. Column combinator [Traducir]
  7. Pseudo-classes
    1. :active
    2. :any-link
    3. :checked
    4. :blank [Traducir]
    5. :default
    6. :defined
    7. :dir()
    8. :disabled
    9. :empty
    10. :enabled
    11. :first
    12. :first-child
    13. :first-of-type
    14. :fullscreen
    15. :focus
    16. :focus-within
    17. :has
    18. :host() [Traducir]
    19. :host-context() [Traducir]
    20. :hover
    21. :indeterminate
    22. :in-range
    23. :invalid
    24. :is() (:matches(), :any()) [Traducir]
    25. :lang
    26. :last-child
    27. :last-of-type
    28. :left
    29. :link
    30. :not()
    31. :nth-child
    32. :nth-last-child
    33. :nth-last-of-type()
    34. :nth-of-type
    35. :only-child
    36. :only-of-type
    37. :optional
    38. :out-of-range
    39. :placeholder-shown
    40. :read-only
    41. :read-write
    42. :required
    43. :right
    44. :root
    45. :scope [Traducir]
    46. :target
    47. :valid
    48. :visited
    49. :where() [Traducir]
  8. Pseudo-elements
    1. ::-moz-progress-bar
    2. ::-moz-range-progress
    3. ::-moz-range-thumb
    4. ::-moz-range-track
    5. ::-ms-browse
    6. ::-ms-check
    7. ::-ms-clear
    8. ::-ms-expand
    9. ::-ms-fill
    10. ::-ms-fill-lower
    11. ::-ms-fill-upper
    12. ::-ms-reveal
    13. ::-ms-thumb
    14. ::-ms-ticks-after [Traducir]
    15. ::-ms-ticks-before [Traducir]
    16. ::-ms-tooltip [Traducir]
    17. ::-ms-track
    18. ::-ms-value
    19. ::-webkit-progress-bar
    20. ::-webkit-progress-value
    21. ::-webkit-slider-runnable-track
    22. ::-webkit-slider-thumb
    23. ::after (:after)
    24. ::backdrop
    25. ::before (:before)
    26. ::cue [Traducir]
    27. ::first-letter (:first-letter) [Traducir]
    28. ::first-line (:first-line) [Traducir]
    29. ::grammar-error [Traducir]
    30. ::placeholder [Traducir]
    31. ::selection
    32. ::slotted() [Traducir]
    33. ::spelling-error