Cambiar el color del marcador de posición de una entrada HTML5 con CSS

Chrome es compatible con atributo de marcador de posición on input[type=text] elementos (probablemente otros también lo hagan).

Pero el siguiente CSS no afecta el valor del marcador de posición:

input[placeholder], [placeholder], *[placeholder] {
    color: red !important;
}
<input type="text" placeholder="Value">

Pero Value todavía permanecerá grey en lugar de red.

¿Hay alguna forma de cambiar el color del texto del marcador de posición?

preguntado el 09 de abril de 10 a las 16:04

Aviso rápido (no es una solución, solo un FYI): si recuerdo correctamente, la entrada [marcador de posición] solo coincide etiquetas que tienen un atributo de marcador de posición, no coincide con el atributo de marcador de posición en sí. -

Sí, se me pasó por la cabeza la idea de que esto podría ser como tratar de diseñar el atributo "título" de un elemento. ¡Entonces +1 por pensar igual! -

@MathiasBynens La pseudoclase: placeholder-shown coincide con un elemento de entrada que muestra dicho texto de marcador de posición. Entonces coincide <input> etiqueta, como input selector, pero mostrando el texto del marcador de posición en este momento. Tampoco coincide con el atributo de marcador de posición en sí. -

@HEX No es como el input selector porque eso selecciona todo input elementos. :placeholder-shown solo selecciona input elementos que actualmente muestran el marcador de posición, lo que le permite aplicar estilo solo a esos elementos y aplicar un estilo eficaz al texto del marcador de posición. ¿Qué estás tratando de decir? -

@HEX (Por supuesto, también seleccionó textarea elementos que muestran texto de marcador de posición.) -

30 Respuestas

Implementación

Hay tres implementaciones diferentes: pseudoelementos, pseudoclases y nada.

  • WebKit, Blink (Safari, Google Chrome, Opera 15+) y Microsoft Edge están usando un pseudoelemento: ::-webkit-input-placeholder. [Ref.]
  • Mozilla Firefox 4 a 18 utiliza una pseudoclase: :-moz-placeholder (una colon). [Ref.]
  • Mozilla Firefox 19+ utiliza un pseudoelemento: ::-moz-placeholder, pero el antiguo selector seguirá funcionando durante un tiempo. [Ref.]
  • Internet Explorer 10 y 11 utilizan una pseudoclase: :-ms-input-placeholder. [Ref.]
  • 2017 de abril: La mayoría de los navegadores modernos admiten el pseudoelemento simple ::placeholder [Ref.]

Internet Explorer 9 y versiones anteriores no son compatibles con placeholder atributo en absoluto, mientras Opera 12 y versiones inferiores no son compatibles cualquier selector de CSS para marcadores de posición.

La discusión sobre la mejor implementación aún continúa. Tenga en cuenta que los pseudo-elementos actúan como elementos reales en el DOM de sombra. Una padding en un input no obtendrá el mismo color de fondo que el pseudoelemento.

Selectores CSS

Los agentes de usuario deben ignorar una regla con un selector desconocido. Ver Selectores Nivel 3:

a Grupo de los selectores que contienen un selector no válido no es válido.

Entonces necesitamos reglas separadas para cada navegador. De lo contrario, todos los navegadores ignorarían a todo el grupo.

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #909;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #909;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #909;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #909;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #909;
}

::placeholder { /* Most modern browsers support this now. */
   color:    #909;
}
<input placeholder="Stack Snippets are awesome!">

Notas de uso

  • Tenga cuidado de evitar malos contrastes. El marcador de posición de Firefox parece estar predeterminado con una opacidad reducida, por lo que debe usar opacity: 1 aquí.
  • Tenga en cuenta que el texto del marcador de posición simplemente se corta si no encaja; dimensione sus elementos de entrada en em y pruébelos con una gran configuración de tamaño de fuente mínimo. No olvide las traducciones: algunos idiomas Necesito más espacio por la misma palabra.
  • Navegadores con soporte HTML para placeholder pero sin soporte CSS para eso (como Opera) también debería probarse.
  • Algunos navegadores utilizan CSS adicional predeterminado para algunos input tiposemail, search). Estos pueden afectar el renderizado de formas inesperadas. Utilizar el de propiedades -webkit-appearance y -moz-appearance para cambiar eso. Ejemplo:
    [type="search"] {
        -moz-appearance:    textfield;
        -webkit-appearance: textfield;
        appearance: textfield;
    }

Respondido el 07 de enero de 18 a las 14:01

/* do not group these rules */
*::-webkit-input-placeholder {
    color: red;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: red;
    opacity: 1;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: red;
    opacity: 1;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: red;
}
*::-ms-input-placeholder {
    /* Microsoft Edge */
    color: red;
}
*::placeholder {
    /* modern browser */
    color: red;
}
<input placeholder="hello"/> <br />
<textarea placeholder="hello"></textarea>

Esto le dará estilo a todos input y textarea marcadores de posición.

Nota IMPORTANTE: No agrupe estas reglas. En su lugar, cree una regla separada para cada selector (un selector no válido en un grupo invalida todo el grupo).

Respondido 19 Jul 18, 16:07

Es posible que también desee aplicar estilo a las áreas de texto:

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #636363;
}
input:-moz-placeholder, textarea:-moz-placeholder {
  color: #636363;
}

Respondido 23 Jul 13, 21:07

Para Bootstrap y Menos usuarios, hay un .placeholder mixin:

// Placeholder text
// -------------------------
.placeholder(@color: @placeholderText) {
  &:-moz-placeholder {
    color: @color;
  }
  &:-ms-input-placeholder {
    color: @color;
  }
  &::-webkit-input-placeholder {
    color: @color;
  }
}

Respondido el 24 de Septiembre de 16 a las 08:09

Además de la respuesta de toscho, he notado algunas inconsistencias de webkit entre Chrome 9-10 y Safari 5 con las propiedades CSS compatibles que vale la pena señalar.

Específicamente, Chrome 9 y 10 no son compatibles background-color, border, text-decoration y text-transform al diseñar el marcador de posición.

La comparación completa entre navegadores es aquí.

Respondido el 25 de Septiembre de 13 a las 14:09

Para Hablar con descaro a usuarios:

// Create placeholder mixin
@mixin placeholder($color, $size:"") {
  &::-webkit-input-placeholder {
    color: $color;
    @if $size != "" {
      font-size: $size;
    }
  }
  &:-moz-placeholder {
    color: $color;
    @if $size != "" {
      font-size: $size;
    }
  }
  &::-moz-placeholder {
    color: $color;
    @if $size != "" {
      font-size: $size;
    }
  }
  &:-ms-input-placeholder {
    color: $color;
    @if $size != "" {
      font-size: $size;
    }
  }
}

// Use placeholder mixin (the size parameter is optional)
[placeholder] {
  @include placeholder(red, 10px);
}

Respondido el 24 de Septiembre de 16 a las 08:09

Esto funcionará bien. DEMO AQUÍ:

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #666;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #666;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #666;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #666;
}
<input type="text" placeholder="Value" />

Respondido el 12 de Septiembre de 16 a las 09:09

En Firefox e Internet Explorer, el color del texto de entrada normal anula la propiedad de color de los marcadores de posición. Entonces, necesitamos

::-webkit-input-placeholder { 
    color: red; text-overflow: ellipsis; 
}
:-moz-placeholder { 
    color: #acacac !important; text-overflow: ellipsis; 
}
::-moz-placeholder { 
    color: #acacac !important; text-overflow: ellipsis; 
} /* For the future */
:-ms-input-placeholder { 
    color: #acacac !important; text-overflow: ellipsis; 
}

Respondido el 24 de Septiembre de 16 a las 08:09

Usa el nuevo ::placeholder si usas autoprefijador.

Tenga en cuenta que el .placeholder mixin de Bootstrap está en desuso a favor de esto.

Ejemplo:

input::placeholder { color: black; }

Al utilizar el autoprefixer, lo anterior se convertirá al código correcto para todos los navegadores.

Respondido 13 Feb 17, 08:02

Solución de navegador cruzado:

/* all elements */
::-webkit-input-placeholder { color:#f00; }
::-moz-placeholder { color:#f00; } /* firefox 19+ */
:-ms-input-placeholder { color:#f00; } /* ie */
input:-moz-placeholder { color:#f00; }

/* individual elements: webkit */
#field2::-webkit-input-placeholder { color:#00f; }
#field3::-webkit-input-placeholder { color:#090; background:lightgreen; text-transform:uppercase; }
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999; }

/* individual elements: mozilla */
#field2::-moz-placeholder { color:#00f; }
#field3::-moz-placeholder { color:#090; background:lightgreen; text-transform:uppercase; }
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999; }

Créditos: David Walsh

Respondido el 02 de enero de 14 a las 23:01

Ahora tenemos una forma estándar de aplicar CSS al marcador de posición de una entrada: ::placeholder pseudo-elemento de este Borrador de nivel 4 del módulo CSS.

Respondido 12 ago 15, 04:08

Esto funciona en Firefox 51. Solo voy a usar este método; los otros navegadores se pondrán al día lo suficientemente pronto para mí (dado que ninguna funcionalidad se rompe si no se aplica el estilo estándar). - Lonnie mejor

No recuerdo dónde encontré este fragmento de código en Internet (no lo escribí yo, no recuerdo dónde lo encontré ni quién lo escribió).

$('[placeholder]').focus(function() {
        var input = $(this);
        if (input.val() == input.attr('placeholder')) {
            input.val('');
            input.removeClass('placeholder');
        }
    }).blur(function() {
        var input = $(this);
        if (input.val() == '' || input.val() == input.attr('placeholder')) {
            input.addClass('placeholder');
            input.val(input.attr('placeholder'));
        }
    }).blur();
    $('[placeholder]').parents('form').submit(function() {
        $(this).find('[placeholder]').each(function() {
            var input = $(this);
            if (input.val() == input.attr('placeholder')) {
                input.val('');
            }
        })
    });

Simplemente cargue este código JavaScript y luego edite su marcador de posición con CSS llamando a esta regla:

form .placeholder {
   color: #222;
   font-size: 25px;
   /* etc. */
}

Respondido el 24 de Septiembre de 16 a las 08:09

Esta es la forma antigua de hacerlo, que he usado bastante. La desventaja es que el texto del marcador de posición desaparece cuando enfoca. Encontré que esto es molesto cuando la interfaz de usuario no incluye etiquetas junto a la entrada. En los últimos meses, comencé a reemplazar este método con el uso de texto de marcador de posición, que creo que es una mejora de UX. - Redtopía

El otro problema con un código como este es que el código del lado del servidor tiene que lidiar con el texto del marcador de posición como una entrada vacía, lo que tiene problemas con los casos extremos en los que desea ingresar una ciudad llamada "Ciudad". En lugar de verificar los valores con el texto del marcador de posición, realmente debería usar una marca de datos modificados en la entrada y luego borrar la entrada en el envío del formulario si la marca no está configurada. Y para las interfaces AJAX, es posible que ni siquiera tenga un formulario, por lo que debería poder asociar un evento de envío arbitrario con la entrada. Esta es una de esas situaciones realmente simples que no lo es. - whelkaholismo

Me acabo de dar cuenta de algo para Mozilla Firefox 19+ que el navegador da un valor de opacidad para el marcador de posición, por lo que el color no será el que realmente desea.

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #eee; opacity:1;
}
input:-moz-placeholder, textarea:-moz-placeholder {
    color: #eee; opacity:1;
}
input::-moz-placeholder, textarea::-moz-placeholder {
    color: #eee; opacity:1;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    color: #eee; opacity:1;
}

Sobrescribo el opacity por 1, así que estará listo.

Respondido el 24 de Septiembre de 16 a las 08:09

Creo que este código funcionará porque solo se necesita un marcador de posición para el texto del tipo de entrada. Entonces, este CSS de una línea será suficiente para su necesidad:

input[type="text"]::-webkit-input-placeholder {
    color: red;
}

Respondido el 24 de Septiembre de 16 a las 08:09

No uses este más. Hay varios elementos más con marcador de posición y más prefijos. Consulte las soluciones anteriores o utilice ::placeholder junto con autoprefixer. - RiZKiT

Para Bootstrap usuarios, si está utilizando class="form-control", puede haber un problema de especificidad de CSS. Deberías tener una prioridad más alta:

.form-control::-webkit-input-placeholder {
    color: red;
}
//.. and other browsers

O si estás usando Menos:

.form-control{
    .placeholder(red);
}

Respondido el 24 de Septiembre de 16 a las 08:09

Si está utilizando Bootstrap y no pudo hacer que esto funcione, entonces probablemente se perdió el hecho de que Bootstrap agrega estos selectores. Estamos hablando de Bootstrap v3.3.

Si está intentando cambiar el marcador de posición dentro de un .form-control Clase CSS, entonces debe anularla de esta manera:

.form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #777;
}
.form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #777;
    opacity:  1;
}
.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #777;
    opacity:  1;
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color:    #777;
}

Respondido el 24 de Septiembre de 16 a las 09:09

Qué tal esto

<input type="text" value="placeholder text" onfocus="this.style.color='#000'; 
    this.value='';" style="color: #f00;" />

Sin CSS ni marcador de posición, pero obtienes la misma funcionalidad.

contestado el 15 de mayo de 19 a las 17:05

¿Qué sucede si alguien vuelve a hacer clic después de escribir algo? ¡El texto original que escribió desaparecerá! - Suerte Soni

@LuckySoni tu podría hacer esto, pero personalmente prefiero el primero. <input type="text" value="placeholder text" onfocus="if(!this.haswriting){this.style.color='#000'; this.value='';}" onblur="if(!this.value){this.style.color='#f00'; this.value='placeholder text'; this.haswriting=false;}else{this.haswriting=true};" style="color: #f00;"/> - user1729061

Incluso su segunda versión no ofrece la misma funcionalidad. Si el usuario envía el <form> con esta entrada, el texto del marcador de posición se enviará al servidor. He visto que muchos sitios hacen esto mal. - lqc

¡Esto es peligroso! ¡Si vuelves a la forma perdiste todo! - Mobarak Alí

Este código corto y limpio:

::-webkit-input-placeholder {color: red;}
:-moz-placeholder           {color: red; /* For Firefox 18- */}
::-moz-placeholder          {color: red; /* For Firefox 19+ */}
:-ms-input-placeholder      {color: red;}

Respondido 30 ago 17, 19:08

Probé todas las combinaciones aquí para cambiar el color, en mi plataforma móvil, y finalmente fue:

-webkit-text-fill-color: red;

que hizo el truco.

Respondido el 24 de Septiembre de 16 a las 08:09

This property allows you to specify a fill color for text. If it is not set, then the color property will be used to do the fill. Me parece que tienes alguna otra regla CSS que establece el color propiedad. - david murdoch

Para usuarios de SASS / SCSS que utilizan Borbón, tiene una función incorporada.

//main.scss
@import 'bourbon';

input {
  width: 300px;

  @include placeholder {
    color: red;
  }
}

Salida CSS, también puede tomar esta parte y pegarla en su código.

//main.css

input {
  width: 300px;
}

input::-webkit-input-placeholder {
  color: red;
}
input:-moz-placeholder {
  color: red;
}
input::-moz-placeholder {
  color: red;
}
input:-ms-input-placeholder {
  color: red;
}

Respondido 04 Oct 16, 08:10

prueba este código para diferentes elementos de entrada de diferentes estilos

your css selector::-webkit-input-placeholder { /*for webkit */
    color:#909090;
    opacity:1;
}
 your css selector:-moz-placeholder { /*for mozilla */
    color:#909090;
    opacity:1;
}
 your css selector:-ms-input-placeholder { /*for for internet exprolar */ 
   color:#909090;
   opacity:1;
}

ejemplo 1:

input[type="text"]::-webkit-input-placeholder { /*for webkit */
    color: red;
    opacity:1;
}
 input[type="text"]:-moz-placeholder { /*for mozilla */
    color: red;
    opacity:1;
}
 input[type="text"]:-ms-input-placeholder { /*for for internet exprolar */ 
   color: red;
   opacity:1;
}

ejemplo 2:

input[type="email"]::-webkit-input-placeholder { /*for webkit */
    color: gray;
    opacity:1;
}
 input[type="email"]:-moz-placeholder { /*for mozilla */
    color: gray;
    opacity:1;
}
 input[type="email"]:-ms-input-placeholder { /*for for internet exprolar */ 
   color: gray;
   }

Respondido 13 Oct 17, 07:10

Añadiendo una posibilidad real muy bonita y sencilla: filtros CSS!

enter image description here

enter image description here

enter image description here

Aplicará estilo a todo, incluido el marcador de posición.

Lo siguiente establecerá ambos input elementos en la misma paleta, utilizando el filtro de tono para cambios de color. Se renderiza muy bien ahora en los navegadores (excepto, por ejemplo, ...)

input {
  filter: sepia(100%) saturate(400%) grayscale(0) contrast(200%) hue-rotate(68deg) invert(18%);
}
<input placeholder="Hello world!" />
<input type="date" /><br>
<input type="range" />
<input type="color" />

Para permitir que los usuarios lo cambien dinámicamente, usando un color de tipo de entrada para los cambios, o para encontrar matices, consulte este fragmento:

De: https://codepen.io/Nico_KraZhtest/pen/bWExEB

function stylElem() {
  stylo.dataset.hue = ((parseInt(stylo.value.substring(1), 16))/46666).toFixed(0)
  Array.from(document.querySelectorAll('input, audio, video')).forEach(function(e){
      e.style.cssText += ";filter:sepia(100%) saturate(400%)grayscale(0)contrast(200%)hue-rotate("+ stylo.dataset.hue+"deg)invert("+(stylo.dataset.hue/3.6)+"%)"
  out.innerText = e.style.cssText
})()}

stylElem()
body {background: black; color: white}
Choose a color!
<input type="color" id="stylo" oninput="stylElem()">
<br>
<div id="out"></div> <p>
  <input placeholder="Hello world!" />
  <input type="date" /><br>
  <input type="range" />
 <br>
<audio controls src="#"></audio> <br><br> 
<video controls src="#"></video>

Documentos de filtros CSS: https://developer.mozilla.org/en-US/docs/Web/CSS/filter

Respondido el 02 de Septiembre de 20 a las 16:09

Aquí hay un ejemplo más:

.form-control::-webkit-input-placeholder {
  color: red;
  width: 250px;
}
h1 {
  color: red;
}
<div class="col-sm-4">
  <input class="form-control" placeholder="Enter text here.." ng-model="Email" required/>
</div>

contestado el 31 de mayo de 16 a las 10:05

De acuerdo, los marcadores de posición se comportan de manera diferente en diferentes navegadores, por lo que necesita usar el prefijo del navegador en su CSS para hacerlos idénticos, por ejemplo, Firefox le da una transparencia al marcador de posición de forma predeterminada, por lo que debe agregar opacidad 1 a su css, más el color, no lo es una gran preocupación la mayoría de las veces, pero es bueno que sean consistentes:

*::-webkit-input-placeholder { /* WebKit browsers */
    color:    #ccc;
}
*:-moz-placeholder { /* Mozilla Firefox <18 */
    color:    #ccc;
    opacity:  1;
}
*::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #ccc;
    opacity:  1;
}
*:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color:    #ccc;
}

contestado el 11 de mayo de 17 a las 13:05

Puede cambiar el color del marcador de posición de una entrada HTML5 con CSS. Si por casualidad, su CSS entra en conflicto, esta nota de código funciona, puede usar (! Important) como se muestra a continuación.

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#909 !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:#909 !important;
   opacity:1 !important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:#909 !important;
   opacity:1 !important;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#909 !important;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:#909 !important;
}

<input placeholder="Stack Snippets are awesome!">

Espero que esto ayude.

Respondido el 21 de diciembre de 17 a las 08:12

Puede usar esto para el estilo de entrada y enfoque:

input::-webkit-input-placeholder  { color:#666;}
input:-moz-placeholder  { color:#666;}
input::-moz-placeholder { color:#666;}
input:-ms-input-placeholder  { color:#666;}
/* focus */
input:focus::-webkit-input-placeholder { color:#eee; }
input:focus:-moz-placeholder { color:#eee } /* FF 4-18 */
input:focus::-moz-placeholder { color:#eee } /* FF 19+ */
input:focus:-ms-input-placeholder { color:#eee } /* IE 10+ */

contestado el 13 de mayo de 18 a las 16:05

La forma más sencilla sería:

#yourInput::placeholder {
    color: red;/*As an example*/
}
/* if that would not work, you can always try styling the attribute itself: */
#myInput[placeholder] {
    color: red;
}

Respondido 27 Oct 18, 21:10

Aquí está la solución con Selectores CSS

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #909;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #909;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #909;
   opacity:  1;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #909;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #909;
}
  • WebKit, parpadeo (Safari, Google Chrome, Ópera 15+) y Microsoft Edge están usando un pseudo-elemento:
    :: - marcador de posición de entrada de webkit.
  • Mozilla Firefox 4 a 18 está usando una pseudo-clase:
    : -moz-placeholder (dos puntos).
    MozillaFirefox 19+ está usando un pseudo-elemento:
    :: - moz-placeholder, pero el antiguo selector seguirá funcionando por un tiempo.
  • Internet Explorer 10 y 11 están usando una pseudoclase:
    : -ms-input-placeholder.
  • Internet Explorer 9 y versiones inferiores no admiten el atributo de marcador de posición en absoluto, mientras que Opera 12 y versiones inferiores no admiten ningún selector de CSS para marcadores de posición.

Respondido el 04 de Septiembre de 19 a las 07:09

Compass tiene un mixin para esto fuera de la caja.

Toma tu ejemplo:

<input type="text" placeholder="Value">

Y en SCSS usando brújula:

input[type='text'] {
  @include input-placeholder {
    color: #616161;
  }
}

Consulte los documentos para la mezcla de marcador de posición de entrada.

Respondido el 20 de Septiembre de 16 a las 13:09

Una parte de HTML:

 <form action="www.anything.com">
 <input type="text" name="name"
  placeholder="Enter sentence"/>
  </form>

Voy a mostrar cómo cambiar el color de la expresión de 'Ingresar oración' por CSS:

  ::placeholder{
  color:blue;
   }

Respondido 18 Jul 19, 04:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.