[Ovillo] CSS Attribute Selectors
Hola, Estoy maquetando una web en la que se combinan diferentes fuentes (font-family) y tamaños (font-size). Hasta ahora había resuelto esto defiendo clases específicas para cada caso. Por ejemplo: .light-12 { font-size: 12px; } ... .light-12, .light-14, .light-32 { font-family: 'fooLight'; } De pronto me he encontrado con este artículo del W3C que explica los selectores por atributos[1]; y he pensado que quizás podía sacarle partido para poder agrupar las definiciones quedando algo como: .light-12 { font-size: 12px; } ... [class|=light] { font-family: 'fooLight'; } Realmente, esto es sólo un ejemplo ilustrativo pero creo que se le puede sacar mucho partido si utilizas prefijos en los nombres de clases como algo parecido a un "namespace" en programación. ¿Qué opináis sobre esta solución? ¿es demasiado enrevesada? ¿puede traer problemas? Gracias. CHK [1] http://www.w3schools.com/css/css_attribute_selectors.asp ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] CSS Attribute Selectors
Hola, yo no los usaría. Aparte de que pueden dar problemas en el Explorer, en realidad no son necesarios y te complican la existencia. Es más limpio si defines estilos completos y usas class. Por ejemplo .desarrollo { font-family tal font-size pascual } .titulares... Si tienes que retocar esa página dentro de dos años, te será más fácil localizar cada cosa y cambiarla (entre otras ventajas). S2. Marcos El 30 de agosto de 2012 15:00, CHK Webmaster escribió: > Hola, > > Estoy maquetando una web en la que se combinan diferentes fuentes > (font-family) y tamaños (font-size). > Hasta ahora había resuelto esto defiendo clases específicas para cada caso. > Por ejemplo: > > .light-12 { >font-size: 12px; > } > ... > .light-12, .light-14, .light-32 { >font-family: 'fooLight'; > } > > > De pronto me he encontrado con este artículo del W3C que explica los > selectores por atributos[1]; y he pensado que quizás podía sacarle partido > para poder agrupar las definiciones quedando algo como: > > .light-12 { >font-size: 12px; > } > ... > [class|=light] { >font-family: 'fooLight'; > } > > > Realmente, esto es sólo un ejemplo ilustrativo pero creo que se le puede > sacar mucho partido si utilizas prefijos en los nombres de clases como algo > parecido a un "namespace" en programación. > ¿Qué opináis sobre esta solución? ¿es demasiado enrevesada? ¿puede traer > problemas? > > Gracias. > CHK > > [1] http://www.w3schools.com/css/css_attribute_selectors.asp > ___ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > -- Marcos Méndez Filesi ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] CSS Attribute Selectors
Buenas tardes: Yo estoy con Marcos: No es recomendable usar nombres de clases con las propiedades que representan. Por eso mismo en html se cambio: b por strong, i por em. Por otra parte, hace poco en las listas comentaron como unir clases para dotar de más versatilidad a las css. Ejemplo: .estilo1 { font-family: Arial; } .estilo2 { font-family: Verdana; } .estilo1.destacado { font-size: 18px; } .estilo2.destacado { font-size: 20px; } .estilo1.normal { font-size: 14px; } .estilo2.normal { font-size: 16px; } asi podrias tener: Este texto será Arial y 14px Este texto será Arial y 18px Este texto será Verdana y 16px Este texto será Verdana y 20px Un saludo -- Manuel Canga Desarrollo creativo de CMS y frameworks Email: *i...@latrasweb.net* Web: http://www.latrasweb.net Twitter: http://twitter.com/latrasweb_net El 30 de agosto de 2012 15:12, marcos méndez filesi escribió: > Hola, > > yo no los usaría. Aparte de que pueden dar problemas en el Explorer, en > realidad no son necesarios y te complican la existencia. > > Es más limpio si defines estilos completos y usas class. > > Por ejemplo > > .desarrollo { > font-family tal > font-size pascual > } > > .titulares... > > Si tienes que retocar esa página dentro de dos años, te será más fácil > localizar cada cosa y cambiarla (entre otras ventajas). > > S2. > > Marcos > > El 30 de agosto de 2012 15:00, CHK Webmaster > escribió: > > > Hola, > > > > Estoy maquetando una web en la que se combinan diferentes fuentes > > (font-family) y tamaños (font-size). > > Hasta ahora había resuelto esto defiendo clases específicas para cada > caso. > > Por ejemplo: > > > > .light-12 { > >font-size: 12px; > > } > > ... > > .light-12, .light-14, .light-32 { > >font-family: 'fooLight'; > > } > > > > > > De pronto me he encontrado con este artículo del W3C que explica los > > selectores por atributos[1]; y he pensado que quizás podía sacarle > partido > > para poder agrupar las definiciones quedando algo como: > > > > .light-12 { > >font-size: 12px; > > } > > ... > > [class|=light] { > >font-family: 'fooLight'; > > } > > > > > > Realmente, esto es sólo un ejemplo ilustrativo pero creo que se le puede > > sacar mucho partido si utilizas prefijos en los nombres de clases como > algo > > parecido a un "namespace" en programación. > > ¿Qué opináis sobre esta solución? ¿es demasiado enrevesada? ¿puede traer > > problemas? > > > > Gracias. > > CHK > > > > [1] http://www.w3schools.com/css/css_attribute_selectors.asp > > ___ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > -- > Marcos Méndez Filesi > ___ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] CSS Attribute Selectors
Perdon los dos p de abajo son estilo2 :D Un saludo -- Manuel Canga Desarrollo creativo de CMS y frameworks Email: *i...@latrasweb.net* Web: http://www.latrasweb.net Twitter: http://twitter.com/latrasweb_net El 30 de agosto de 2012 15:21, Manuel Canga - Latrasweb.net < i...@latrasweb.net> escribió: > Buenas tardes: > > Yo estoy con Marcos: No es recomendable usar > nombres de clases con las propiedades que representan. > Por eso mismo en html se cambio: b por strong, > i por em. > > Por otra parte, hace poco en las listas comentaron como > unir clases para dotar de más versatilidad a las css. > > Ejemplo: > > .estilo1 { > font-family: Arial; > } > > .estilo2 { >font-family: Verdana; > } > > .estilo1.destacado { > font-size: 18px; > } > > .estilo2.destacado { >font-size: 20px; > } > > .estilo1.normal { > font-size: 14px; > } > > .estilo2.normal { > font-size: 16px; > } > > asi podrias tener: > Este texto será Arial y 14px > Este texto será Arial y 18px > Este texto será Verdana y 16px > Este texto será Verdana y 20px > > > > Un saludo > -- > Manuel Canga > Desarrollo creativo de > CMS y frameworks > Email: *i...@latrasweb.net* > Web: http://www.latrasweb.net > Twitter: http://twitter.com/latrasweb_net > > > > El 30 de agosto de 2012 15:12, marcos méndez filesi > escribió: > > Hola, >> >> yo no los usaría. Aparte de que pueden dar problemas en el Explorer, en >> realidad no son necesarios y te complican la existencia. >> >> Es más limpio si defines estilos completos y usas class. >> >> Por ejemplo >> >> .desarrollo { >> font-family tal >> font-size pascual >> } >> >> .titulares... >> >> Si tienes que retocar esa página dentro de dos años, te será más fácil >> localizar cada cosa y cambiarla (entre otras ventajas). >> >> S2. >> >> Marcos >> >> El 30 de agosto de 2012 15:00, CHK Webmaster >> escribió: >> >> > Hola, >> > >> > Estoy maquetando una web en la que se combinan diferentes fuentes >> > (font-family) y tamaños (font-size). >> > Hasta ahora había resuelto esto defiendo clases específicas para cada >> caso. >> > Por ejemplo: >> > >> > .light-12 { >> >font-size: 12px; >> > } >> > ... >> > .light-12, .light-14, .light-32 { >> >font-family: 'fooLight'; >> > } >> > >> > >> > De pronto me he encontrado con este artículo del W3C que explica los >> > selectores por atributos[1]; y he pensado que quizás podía sacarle >> partido >> > para poder agrupar las definiciones quedando algo como: >> > >> > .light-12 { >> >font-size: 12px; >> > } >> > ... >> > [class|=light] { >> >font-family: 'fooLight'; >> > } >> > >> > >> > Realmente, esto es sólo un ejemplo ilustrativo pero creo que se le puede >> > sacar mucho partido si utilizas prefijos en los nombres de clases como >> algo >> > parecido a un "namespace" en programación. >> > ¿Qué opináis sobre esta solución? ¿es demasiado enrevesada? ¿puede traer >> > problemas? >> > >> > Gracias. >> > CHK >> > >> > [1] http://www.w3schools.com/css/css_attribute_selectors.asp >> > ___ >> > Lista de distribución Ovillo >> > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org >> > Puedes modificar tus datos o desuscribirte en la siguiente dirección: >> > http://lists.ovillo.org/mailman/listinfo/ovillo >> > >> >> >> >> -- >> Marcos Méndez Filesi >> ___ >> Lista de distribución Ovillo >> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org >> Puedes modificar tus datos o desuscribirte en la siguiente dirección: >> http://lists.ovillo.org/mailman/listinfo/ovillo >> > > ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo