1. Inicio
  2. Pregunta y respuesta
  3. FSC recomendados notación

FSC recomendados notación

2012-05-28 11 views

Respuesta

3

Hay a great doco sobre el uso de selectores CSS eficientes, se centran en reglas con selectores excesivamente cualificados:

selectores ID son únicos por definición. La inclusión de etiquetas o calificadores de clase solo agrega información redundante que debe evaluarse innecesariamente.

En lugar de simplemente aplicar el estilo a un elemento con id main, el selector hará volver a calificar el elemento mediante la comprobación de si es o no también un div (en ese orden).Para aclarar: selectores CSS se evalúan derecha a izquierda, a diferencia misma sintaxis de selección cuando se utiliza en jQuery etc.

sugerencia de

Re pixelistik que div#main es más específico que #main - sí, eso es técnicamente correcto, por eso si usted tiene que recurrir a esto para aumentar la especificidad de una regla, lo más probable es que la estructura de CSS en la que está trabajando no sea tan precisa como debería ser.

Fuente

2012-05-28 22:37:26

2

Entonces la diferencia es que:

Cuando escriba div#main el estilo será solo para el elemento <div>. Cuando se escribe #main que puede ser utilizado como el estilo de <div>, <span>, <p>, etc.

Y lo que recomendaría es difícil de decir, todos los desarrolladores que lo tiene diferente. Así que estoy usando por ejemplo span.<nameClass> cuando está anidado en <li> por ejemplo.

#nav li span.href a { 
... 
}

Creo que se usa cuando se quiere que una clase con un nombre específico solo tenga un elemento.

Así que cuando su escriba span#href funcionará solo para <span id="href">Simply dummy text</span> no para otros. Cuando escriba #href funcionará para <span id="href">Simply dummy text</span> o <a href="#" id="href">Link</a>, pero ambos son correctos cuando usted también pregunta sobre esto. Diferencias que escribí arriba.

Fuente

2012-05-28 22:25:58 Sajmon

+0

Gracias, pero relacionado con el código proporcionado? Ambos divs. – Teson

+0

hombre editado :-) – Sajmon

+0

¿Choque de identificación? Nunca voy allí ... – Teson

2

#main coincide con todo con ID 'principal', mientras que div#main solo coincide con <div> elementos con ID principal.

Idealmente, nunca debe tener dos elementos con la misma ID, por lo que los dos realmente no hacen la diferencia, pero probablemente haya problemas relacionados con el rendimiento en cuanto a si especificar div hace que encuentre el resultado más rápido.

Fuente

2012-05-28 22:26:52 Death

+2

Hace que sea más lento en realidad. Como dije en mi respuesta a continuación, los selectores CSS se analizan RTL, lo que significa que al encontrar un elemento con un id 'main', el motor de representación tendrá que comprobar si es también un' div'. Si bien el esfuerzo en torno a esto podría considerarse insignificante, me preocuparía más el impacto estructural y posiblemente la anulación de la especificidad no deseada. –

+2

@ o.v. Que el tipo de elemento esté marcado después de que un navegador lo encuentre por su ID no tiene nada que ver con el análisis RTL. El análisis de RTL funciona en combinadores. – BoltClock

+0

@BoltClock: considere dos escenarios, cuando el motor de representación evalúa un '#aaa .bbb' y cuando se usa para unir elementos DOM con JS. En el primer escenario, todos los elementos que coincidan con '.bbb' se encontrarán primero y luego se volverán a calificar al buscar su elemento principal (RTL). En el segundo escenario, se encuentra (rápidamente) un elemento que coincide con '# aaa' y luego se busca una coincidencia con' .bbb' en sus descendientes. Esto es lo que quise decir al decir * los selectores de css son analizados RTL * - dos formas diferentes para resolver el mismo problema. Y no sé por qué, simplemente sigo con el flujo :) –

Cuestiones relacionadas

 Cuestiones relacionadas