ASP.NET Web Forms y los nuevos selectores CSS3

Aunque no es en absoluto la mejor opción, tengo observado en programadores de ASP.NET el intento de incluir estilos en elementos buscándolos por su identificador. Siempre será una opción menos mala que la de meter el estilo en línea, pero no tan buena cómo utilizar clases CSS.

En ASP.NET Web Forms nos encontramos con una barrera adicional: no conocemos los identificadores de los elementos en tiempo de diseño. Un ejemplo sencillo, incluyo una <asp:label id=”lblPrueba”> dentro de un <asp:content> que a su vez utilizará una MasterPage, y el resultado final será que dicho elemento se me renderiza cómo <span id=”MainContent_lblPrueba”>. En ese caso si queremos aplicar un estilo CSS a dicho elemento buscándolo por id, tendremos que escribir el selector correspondiente para el id final, es decir, el que se enviará al navegador. Es evidente que un cambio en los contenedores del elemento puede dar al traste con esta feliz unión entre CSS e Id del elemento.

Aprovechando la circunstancia de que el identificador original que nosotros dimos al elemento siempre aparece al final del identificador cliente podemos utilizar el nuevo selector de CSS3 para seleccionar lo que nos interesa. En este caso nos valdría algo así:

     *[id$=lblPrueba]        { “estilos para la etiqueta lblPrueba”           }

Este selector viene diciendo: selecciona cualquier elemento (*) cuyo id termine en “lblPrueba”, con lo cual asunto zanjado.

Puedes ampliar información sobre este selector y otros parecidos en esta página.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *