pseudo - selectores css
Manejo de dos puntos en un ID de elemento en un selector de CSS (8)
Esta pregunta ya tiene una respuesta aquí:
JSF está configurando el ID de un campo de entrada en search_form:expression . Necesito especificar un poco de estilo en ese elemento, pero ese punto se parece al comienzo de un pseudo-elemento para el navegador, por lo que se marca como no válido e ignorado. ¿Hay alguna forma de escapar del colon o algo así?
input#search_form:expression {
///...
}
Barra invertida:
input#search_form/:expression { ///...}
- Consulte también Uso de espacios de nombres con CSS (MSDN)
En JSF 2,0, puede especificar el separador usando el archivo web.xml como init-param de javax.faces.SEPARATOR_CHAR
Lee esto:
Encontré que este formato solo funcionaba para IE7 (Firefox también), y uso JSF / Icefaces 1.8.2.
Say form id=FFF, element id=EEE var jq=jQuery.noConflict(); jq(document).ready(function() { jq("[id=FFF:EEE]").someJQueryLibFunction({ jQuery lib function options go here }) });
Puedes escapar con una barra invertida
input#search_form/:expression {
///...
}
De la Especificación CSS
4.1.3 Personajes y caso
Las siguientes reglas siempre son válidas:
Todas las hojas de estilo CSS son insensibles a las mayúsculas y minúsculas, a excepción de las partes que no están bajo el control de CSS. Por ejemplo, la sensibilidad a mayúsculas y minúsculas de los valores de los atributos HTML "id" y "clase", de nombres de fuentes y de URI queda fuera del alcance de esta especificación. Tenga en cuenta en particular que los nombres de los elementos no distinguen entre mayúsculas y minúsculas en HTML, pero distingue entre mayúsculas y minúsculas en XML. En CSS, los identificadores (incluidos nombres de elementos, clases e ID en selectores) pueden contener solo los caracteres [a-z0-9] e ISO 10646 caracteres U + 00A1 y superiores, más el guión (-) y el guión bajo (_) ; no pueden comenzar con un dígito, o un guión seguido de un dígito. Los identificadores también pueden contener caracteres escapados y cualquier carácter ISO 10646 como un código numérico (consulte el siguiente elemento). Por ejemplo, el identificador "B & W?" puede escribirse como "B / & W /?" o "B / 26 W / 3F". Tenga en cuenta que Unicode es código por código equivalente a ISO 10646 (vea [UNICODE] y [ISO10646]).
En CSS 2.1, un carácter de barra invertida () indica tres tipos de escape de caracteres. Primero, dentro de una cadena, se ignora una barra invertida seguida de una línea nueva (es decir, se considera que la cadena no contiene ni la barra invertida ni la línea nueva).
En segundo lugar, cancela el significado de caracteres CSS especiales. Cualquier carácter (excepto un dígito hexadecimal) se puede escapar con una barra invertida para eliminar su significado especial. Por ejemplo, "/" "es una cadena que consta de una comilla doble. Los preprocesadores de la hoja de estilos no deben eliminar estas barras invertidas de una hoja de estilos, ya que eso cambiaría el significado de la hoja de estilo.
En tercer lugar, los escapes de barra invertida permiten a los autores referirse a caracteres que no pueden colocar fácilmente en un documento. En este caso, la barra invertida es seguida por un máximo de seis dígitos hexadecimales (0..9A..F), que representan el carácter ISO 10646 ([ISO10646]) con ese número, que no debe ser cero. (No está definido en CSS 2.1 qué sucede si una hoja de estilo contiene un carácter con código cero Unicode.) Si un carácter en el rango [0-9a-f] sigue al número hexadecimal, debe hacerse el final del número claro. Hay dos maneras de hacerlo:
con un espacio (u otro carácter de espacio en blanco): "/ 26 B" ("& B"). En este caso, los agentes de usuario deberían tratar un par "CR / LF" (U + 000D / U + 000A) como un solo carácter de espacio en blanco. proporcionando exactamente 6 dígitos hexadecimales: "/ 000026B" ("& B") De hecho, estos dos métodos pueden combinarse. Solo se ignora un carácter de espacio en blanco después de un escape hexadecimal. Tenga en cuenta que esto significa que un espacio "real" después de la secuencia de escape debe escaparse o duplicarse.
Si el número está fuera del rango permitido por Unicode (por ejemplo, "/ 110000" está por encima del 10FFFF máximo permitido en Unicode actual), el UA puede reemplazar el escape con el "carácter de reemplazo" (U + FFFD). Si se va a mostrar el carácter, el UA debería mostrar un símbolo visible, como un glifo de "carácter faltante" (véase 15.2, punto 5).
Nota: los escapes de barra invertida, siempre que estén permitidos, siempre se consideran parte de un identificador o una cadena (es decir, "/ 7B" no es puntuación, a pesar de que "{" es, y "/ 32" está permitido al comienzo de un nombre de clase, aunque "2" no lo es). El identificador "te / st" es exactamente el mismo identificador que "prueba".
Trabajo en un marco ADF y muchas veces tengo que usar JQuery para seleccionar elementos. Este formato funciona para mí. Esto también funciona en IE8.
$(''[id*="gantt1::majorAxis"]'').css(''border-top'', ''solid 1px '' + mediumGray);
Tuve el mismo problema con dos puntos, y no pude cambiarlos (no pude acceder al código que arroja dos puntos) y quería buscarlos con selectores de CSS3 con jQuery.
Lo puse aquí, porque podría ser útil para alguien
input[id="something:something"] funcionó bien en los selectores de jQuery, y podría funcionar en las hojas de estilo también (podría tener problemas con el navegador)
Usar una barra diagonal inversa antes del punto no funciona en muchas versiones de IE (particularmente 6 y 7, posiblemente otras).
Una solución es usar el código hexadecimal para los dos puntos, que es / 3A
ejemplo:
input#search_form/3A expression { }
Esto funciona en todos los navegadores: incluyendo IE6 + (y posiblemente antes?), Firefox, Chrome, Opera, etc. Es parte del estándar CSS2 .
Este artículo te dirá cómo escapar de cualquier personaje en CSS.
Ahora, incluso hay una herramienta para ello: http://mothereff.in/css-escapes#0search%5fform%3Aexpression
TL; DR Todas las otras respuestas a esta pregunta son incorrectas. Debe evitar tanto el guión bajo (para evitar que IE6 ignore la regla por completo en algunos casos extremos) como el carácter de dos puntos para que el selector funcione correctamente en diferentes navegadores.
Técnicamente, el carácter de dos puntos se puede escapar como /: pero eso no funciona en IE <8, por lo que tendrá que usar /3a :
#search/_form/3a expression {}