Advertisement
CSS en resumen..
Moderator: hefesto
- Alicante
- Joomla! Explorer
- Posts: 496
- Joined: Thu Aug 18, 2005 11:03 pm
CSS en resumen..
CSS en resumen:
VENTAJAS DE USAR CSS:
1. Separación del contenido y la presentación
2. Reducción considerable del peso de una página
3. Facilidad para cambiar el diseño
4. Diseños más exactos (sin truquitos tipo spacer.gif)
5. Adaptabilidad a distintos dispositivos
6. 'Pureza' del código (usar cada etiqueta para lo que realmente es)
ENLACES DE INTERÉS
ESPECIFICACIÓN CSS2
ESPECIFICACION XHTML 1.0
UN BUEN MANUAL CSS
UTILIDAD PARA CHEQUEAR UNA HOJA DE ESTILOS
GUIAS, EJEMPLOS Y TUTORIALES
http://www.alistapart.com/
http://css.maxdesign.com.au/
http://www.thenoodleincident.com/
http://www.bluerobot.com/web/layouts/
http://www.richinstyle.com/
http://www.digital-web.com/tutorials/tu ... 01-5.shtml
http://www.disenorama.com/
http://www.minid.net/archivos/categorias/css/index.php
http://www.brainjar.com/css/using/
http://www.meyerweb.com/eric/css/
http://www.mako4css.com/index.htm
http://www.thenoodleincident.com/tutori ... boxes.html
http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/
http://www.csszengarden.com/
http://www.tierradenomadas.com/
http://www.w3schools.com/css/
http://dezwozhere.com/links.html
http://www.cssplay.co.uk/index.html
http://www.hotdesign.com/seybold/
(este último es una buena explicación - en inglés - de por qué no maquetar con tablas)
http://www.disenorama.com/
http://www.complexspiral.com/publicatio ... g-margins/
http://www.complexspiral.com/publicatio ... ng-floats/
http://www.tizag.com/cssT/ (Explican cuando usar ID y cuando usar CLASS de una forma muy simple)
http://www.tizag.com/cssT/cssid.php
http://webhost.bridgew.edu/etribou/layouts/skidoo/
http://www.cbel.com/style_sheets/?order=alpha
http://www.artypapers.com/csshelppile/
http://brunildo.org/test/ (CSS tips, tricks, hacks por categorias)
http://www.timvansas.nl/bookmarks/
http://www.alvit.de/handbook/
http://centricle.com/ref/css/filters/?h ... lumns=true (css hacks y la correspondencia en todos los navegadores )
http://www.albinoblacksheep.com/livedesign/ (Live Design, o cómo maquetar una página en CSS, paso a paso. )
http://www.ilovejackdaniels.com/css_cheat_sheet.png
http://www.cssplay.co.uk/index.html
http://positioniseverything.net/index.php
http://www.ignside.net/man/css/sintaxis.php (Apuntes de CSS Sintáxis español)
http://www.htmlhelp.com/es/reference/cs ... rties.html (propiedades css español)
http://www.desarrolloweb.com/css/ (CSS A FONDO español)
http://www.cristalab.com/tutoriales/5-css-y-xhtml/ (CSS Y HTML en español)
http://www.redmelon.net/tstme/box_model/ (MODELO INTERACTIVO DE UN BOX EN CSS)
http://www.w3schools.com/css/default.asp
http://simplelogica.net/caoticoneutral/index.php?p=43 (selectores en CSS)
http://www.petefreitag.com/item/475.cfm (20 css tips)
http://www.javiercasares.com/2006/03/24 ... s-con-css/ (Experimentos con CSS ESPAÑOL)
http://www.cssplay.co.uk/menus/index.html (Diferentes menus con estilos CSS) *recomendado
http://www.webtaller.com/info/curso_css.php (Curso de CSS español)
http://www.webtaller.com/info/curso_css.php (Videotutoriales CSS español)*recomendado
http://www.proyectohispano.org/index.ph ... &Itemid=63 (curso en PDF de CSS)
http://glish.com/css/home.asp (tecnicas de CSS)
http://glish.com/css/7.asp (layout plantillas de 3 columnas)
http://www.webreference.com/authoring/s ... /advanced/ (otro layout de 3 columnas)
http://glish.com/css/9.asp (layout plantillas de 2 columnas)
http://pro.html.it/articoli/id_599/idca ... 1/pag.html (plantillas CSS con esquinas redondeadas)*recomendado
http://forum.joomla.org/index.php/topic ... l#msg65758 (bench de una plantilla CSS con características del anterior enlace) *recomendado para empezar a practicar.
http://msdn.microsoft.com/library/defau ... 050831.asp
TUTORIAL PARA INSTALAR LA EXTENSION CSS DE FIREFOX:
http://www.mambosphere.com/developer_ti ... s%2c_live/
ADD-ONS CSS DE FIREFOX:
https://addons.mozilla.org/search.php?q=CSS&app=firefox
WEB DEVELOPER PARA FIREFOX
https://addons.mozilla.org/extensions/m ... on=firefox (*recomendado)
HACKS CSS
http://www.dithered.com/css_filters/index.html
http://centricle.com/ref/css/filters/?h ... lumns=true
y muchos más enlaces en http://www.blogpocket.com/blog/index.php?s=CSS
SITIOS CON COOLSITES HECHOS EN CSS
http://cssvault.com/gallery.php
http://www.cssbeauty.com/
http://www.stylegala.com/
http://www.w3csites.com/
http://larsholst.info/blog/index.php?p=40
Y NO SOLO DE CSS VIVE EL HOMBRE
También la usabilidad, accesibilidad, SEO, etc, son importantes, así que:
http://uxespanol.[URL banned].com/2005/12/h ... -y_27.html
Enlace directo a Herramientas de CSS:
http://uxespanol.[URL banned].com/2005/12/h ... 7.html#2.2
BIBLIOGRAFIA
CASCADING STYLE SHEET, de Anaya
Autores:
Briggs, Owen
Champeon, Steven
Costello, Eric
Patterson, Matt
Nº Páginas: 304
Precio sin IVA: 21,15 € (3.519 Ptas.)
Precio con IVA: 22,00 € (3.660 Ptas.)
Fecha de publicación: 20 Febrero 2003
Diseño con estándares Web
Jeffrey Zeldman
Editorial: Anaya Multimedia
Colección: Diseño y creatividad
SOFTWARE
TOP STYLE(sin duda el mejor editor de hojas de estilo)
STYLE MASTER
Dreamweaver MX 2004
BUG'S CONOCIDOS EN IE:
http://positioniseverything.net/explorer.html
BUG'S CONOCIDOS EN OPERA:
http://positioniseverything.net/op-omnibus.html
BUG'S CONOCIDOS EN MOZILLA:
http://positioniseverything.net/gecko.html
RECOMENDACIONES AL USAR CSS:
http://www.torresburriel.com/weblog/index.php?p=342
http://www.mezzoblue.com/archives/2004/ ... _problems/
Otros enlaces:
Recomiendo http://www.w3c.org que es el corazón de todo esto de los estándares y tiene validadores puros
HTML > http://validator.w3.org
CSS > http://jigsaw.w3.org/css-validator/
CREADOR EN LINEA CSS:
http://www.csscreator.com/version2/pagelayout.php
GENERADOR DE BOTONES:
http://www.webtaller.com/utilidades/css ... scoder.php
GENERADOR DE ROLLOVERS
http://www.collylogic.com/scripts/rollover.html
CREADOR DE ENLACES CSS EN LINEA
http://www.ekiwi.de/tools/csslink/csslink.php
COMPRESOR DE CSS
http://www.arantius.com/tools/css-compressor.php
GENERADOR DE MENUS
http://www.webmaster-toolkit.com/css-me ... ator.shtml
GENERADOR AUTOMATICO DE CAJAS REDONDEADAS
http://www.neuroticweb.com/recursos/css-rounded-box/
Recursos CSS:
http://www.soxiam.com/Notes/CSSTools
http://www.mygnet.com/manuales/css/ (Estupendos tutoriales y manuales oficiales del w3c traducidos al español) *recomendado
http://penguin.theopalgroup.com/cgi-bin ... toracle.py
HERRAMIENTAS VARIAS
http://uxespanol.[URL banned].com/2005/12/h ... 7.html#2.2 (*recomendado, encontrarán muchas utilidades CSS , vista en diferentes navegadores, colores, menus etc., etc.,)
fuente: http://www.domestika.org/foros/viewtopic.php?t=17293
Si conocen alguna herramienta CSS de utilidad favor de postearla.
Saludos
VENTAJAS DE USAR CSS:
1. Separación del contenido y la presentación
2. Reducción considerable del peso de una página
3. Facilidad para cambiar el diseño
4. Diseños más exactos (sin truquitos tipo spacer.gif)
5. Adaptabilidad a distintos dispositivos
6. 'Pureza' del código (usar cada etiqueta para lo que realmente es)
ENLACES DE INTERÉS
ESPECIFICACIÓN CSS2
ESPECIFICACION XHTML 1.0
UN BUEN MANUAL CSS
UTILIDAD PARA CHEQUEAR UNA HOJA DE ESTILOS
GUIAS, EJEMPLOS Y TUTORIALES
http://www.alistapart.com/
http://css.maxdesign.com.au/
http://www.thenoodleincident.com/
http://www.bluerobot.com/web/layouts/
http://www.richinstyle.com/
http://www.digital-web.com/tutorials/tu ... 01-5.shtml
http://www.disenorama.com/
http://www.minid.net/archivos/categorias/css/index.php
http://www.brainjar.com/css/using/
http://www.meyerweb.com/eric/css/
http://www.mako4css.com/index.htm
http://www.thenoodleincident.com/tutori ... boxes.html
http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/
http://www.csszengarden.com/
http://www.tierradenomadas.com/
http://www.w3schools.com/css/
http://dezwozhere.com/links.html
http://www.cssplay.co.uk/index.html
http://www.hotdesign.com/seybold/
(este último es una buena explicación - en inglés - de por qué no maquetar con tablas)
http://www.disenorama.com/
http://www.complexspiral.com/publicatio ... g-margins/
http://www.complexspiral.com/publicatio ... ng-floats/
http://www.tizag.com/cssT/ (Explican cuando usar ID y cuando usar CLASS de una forma muy simple)
http://www.tizag.com/cssT/cssid.php
http://webhost.bridgew.edu/etribou/layouts/skidoo/
http://www.cbel.com/style_sheets/?order=alpha
http://www.artypapers.com/csshelppile/
http://brunildo.org/test/ (CSS tips, tricks, hacks por categorias)
http://www.timvansas.nl/bookmarks/
http://www.alvit.de/handbook/
http://centricle.com/ref/css/filters/?h ... lumns=true (css hacks y la correspondencia en todos los navegadores )
http://www.albinoblacksheep.com/livedesign/ (Live Design, o cómo maquetar una página en CSS, paso a paso. )
http://www.ilovejackdaniels.com/css_cheat_sheet.png
http://www.cssplay.co.uk/index.html
http://positioniseverything.net/index.php
http://www.ignside.net/man/css/sintaxis.php (Apuntes de CSS Sintáxis español)
http://www.htmlhelp.com/es/reference/cs ... rties.html (propiedades css español)
http://www.desarrolloweb.com/css/ (CSS A FONDO español)
http://www.cristalab.com/tutoriales/5-css-y-xhtml/ (CSS Y HTML en español)
http://www.redmelon.net/tstme/box_model/ (MODELO INTERACTIVO DE UN BOX EN CSS)
http://www.w3schools.com/css/default.asp
http://simplelogica.net/caoticoneutral/index.php?p=43 (selectores en CSS)
http://www.petefreitag.com/item/475.cfm (20 css tips)
http://www.javiercasares.com/2006/03/24 ... s-con-css/ (Experimentos con CSS ESPAÑOL)
http://www.cssplay.co.uk/menus/index.html (Diferentes menus con estilos CSS) *recomendado
http://www.webtaller.com/info/curso_css.php (Curso de CSS español)
http://www.webtaller.com/info/curso_css.php (Videotutoriales CSS español)*recomendado
http://www.proyectohispano.org/index.ph ... &Itemid=63 (curso en PDF de CSS)
http://glish.com/css/home.asp (tecnicas de CSS)
http://glish.com/css/7.asp (layout plantillas de 3 columnas)
http://www.webreference.com/authoring/s ... /advanced/ (otro layout de 3 columnas)
http://glish.com/css/9.asp (layout plantillas de 2 columnas)
http://pro.html.it/articoli/id_599/idca ... 1/pag.html (plantillas CSS con esquinas redondeadas)*recomendado
http://forum.joomla.org/index.php/topic ... l#msg65758 (bench de una plantilla CSS con características del anterior enlace) *recomendado para empezar a practicar.
http://msdn.microsoft.com/library/defau ... 050831.asp
TUTORIAL PARA INSTALAR LA EXTENSION CSS DE FIREFOX:
http://www.mambosphere.com/developer_ti ... s%2c_live/
ADD-ONS CSS DE FIREFOX:
https://addons.mozilla.org/search.php?q=CSS&app=firefox
WEB DEVELOPER PARA FIREFOX
https://addons.mozilla.org/extensions/m ... on=firefox (*recomendado)
HACKS CSS
http://www.dithered.com/css_filters/index.html
http://centricle.com/ref/css/filters/?h ... lumns=true
y muchos más enlaces en http://www.blogpocket.com/blog/index.php?s=CSS
SITIOS CON COOLSITES HECHOS EN CSS
http://cssvault.com/gallery.php
http://www.cssbeauty.com/
http://www.stylegala.com/
http://www.w3csites.com/
http://larsholst.info/blog/index.php?p=40
Y NO SOLO DE CSS VIVE EL HOMBRE
También la usabilidad, accesibilidad, SEO, etc, son importantes, así que:
http://uxespanol.[URL banned].com/2005/12/h ... -y_27.html
Enlace directo a Herramientas de CSS:
http://uxespanol.[URL banned].com/2005/12/h ... 7.html#2.2
BIBLIOGRAFIA
CASCADING STYLE SHEET, de Anaya
Autores:
Briggs, Owen
Champeon, Steven
Costello, Eric
Patterson, Matt
Nº Páginas: 304
Precio sin IVA: 21,15 € (3.519 Ptas.)
Precio con IVA: 22,00 € (3.660 Ptas.)
Fecha de publicación: 20 Febrero 2003
Diseño con estándares Web
Jeffrey Zeldman
Editorial: Anaya Multimedia
Colección: Diseño y creatividad
SOFTWARE
TOP STYLE(sin duda el mejor editor de hojas de estilo)
STYLE MASTER
Dreamweaver MX 2004
BUG'S CONOCIDOS EN IE:
http://positioniseverything.net/explorer.html
BUG'S CONOCIDOS EN OPERA:
http://positioniseverything.net/op-omnibus.html
BUG'S CONOCIDOS EN MOZILLA:
http://positioniseverything.net/gecko.html
RECOMENDACIONES AL USAR CSS:
http://www.torresburriel.com/weblog/index.php?p=342
http://www.mezzoblue.com/archives/2004/ ... _problems/
Otros enlaces:
Recomiendo http://www.w3c.org que es el corazón de todo esto de los estándares y tiene validadores puros
HTML > http://validator.w3.org
CSS > http://jigsaw.w3.org/css-validator/
CREADOR EN LINEA CSS:
http://www.csscreator.com/version2/pagelayout.php
GENERADOR DE BOTONES:
http://www.webtaller.com/utilidades/css ... scoder.php
GENERADOR DE ROLLOVERS
http://www.collylogic.com/scripts/rollover.html
CREADOR DE ENLACES CSS EN LINEA
http://www.ekiwi.de/tools/csslink/csslink.php
COMPRESOR DE CSS
http://www.arantius.com/tools/css-compressor.php
GENERADOR DE MENUS
http://www.webmaster-toolkit.com/css-me ... ator.shtml
GENERADOR AUTOMATICO DE CAJAS REDONDEADAS
http://www.neuroticweb.com/recursos/css-rounded-box/
Recursos CSS:
http://www.soxiam.com/Notes/CSSTools
http://www.mygnet.com/manuales/css/ (Estupendos tutoriales y manuales oficiales del w3c traducidos al español) *recomendado
http://penguin.theopalgroup.com/cgi-bin ... toracle.py
HERRAMIENTAS VARIAS
http://uxespanol.[URL banned].com/2005/12/h ... 7.html#2.2 (*recomendado, encontrarán muchas utilidades CSS , vista en diferentes navegadores, colores, menus etc., etc.,)
fuente: http://www.domestika.org/foros/viewtopic.php?t=17293
Si conocen alguna herramienta CSS de utilidad favor de postearla.
Saludos
Last edited by Alicante on Thu Apr 13, 2006 9:48 am, edited 1 time in total.
Tomar la Iniciativa no significa ser insistente, molesto o agresivo. Significa reconocer nuestra responsabilidad de hacer que las cosas sucedan. Stephen R. Covey.
Advertisement
-
- Joomla! Intern
- Posts: 51
- Joined: Sun Apr 16, 2006 6:48 pm
Re: CSS en resumen..
Buenas tengo inconvenientes.. con mis infinity menus en la parte de css, es decir.
-Quiciera quitarlesbordes y de mas cosas. Como tambien mover a la derecha el texto y que tome una imagen en particular.
-Tambien moviendo los elementos de modulos en la templeta .. quiciera saber coprrectamente el manejo de la templeta junto con el css en DreamWeaver
Gracias
PD:ALicante .. aombroso..todo esto :P
-Quiciera quitarlesbordes y de mas cosas. Como tambien mover a la derecha el texto y que tome una imagen en particular.
-Tambien moviendo los elementos de modulos en la templeta .. quiciera saber coprrectamente el manejo de la templeta junto con el css en DreamWeaver
Gracias
PD:ALicante .. aombroso..todo esto :P
- novata
- Joomla! Ace
- Posts: 1144
- Joined: Thu Oct 20, 2005 2:50 pm
Re: CSS en resumen..
plop! x donde empezar con css
- matias.quaglia
- Joomla! Enthusiast
- Posts: 108
- Joined: Sat Mar 11, 2006 10:57 am
- Contact:
Re: CSS en resumen..
Aporto solo un par de enlaces interesantes a este post valiosísimo.
Alicante, un gran trabajo!
Editor CSS hecho en Java
Generador Online de CSS, no es la gran cosa, pero sirve a la hora de empezar con CSS.
Saludos!
Alicante, un gran trabajo!
Editor CSS hecho en Java
Generador Online de CSS, no es la gran cosa, pero sirve a la hora de empezar con CSS.
Saludos!
- Alicante
- Joomla! Explorer
- Posts: 496
- Joined: Thu Aug 18, 2005 11:03 pm
Re: CSS en resumen..
Caramba! aùn existo en este foro , parece increìble que este post aun siga leyèndose.
ñam, ñam, ñam..
bueno, solo pasaba por aquì..
un abrazo a todos los amiguitos de la comunidad Joomla!.
hasta la pròxima.
ñam, ñam, ñam..
bueno, solo pasaba por aquì..
un abrazo a todos los amiguitos de la comunidad Joomla!.
hasta la pròxima.
Tomar la Iniciativa no significa ser insistente, molesto o agresivo. Significa reconocer nuestra responsabilidad de hacer que las cosas sucedan. Stephen R. Covey.
-
- Joomla! Apprentice
- Posts: 9
- Joined: Fri Mar 25, 2011 5:44 pm
Re: CSS en resumen..
Gracias por el aporte!! es muy interesante y ahora a aprender CSS es fantastico!!
-
- Joomla! Apprentice
- Posts: 5
- Joined: Thu Feb 24, 2011 3:02 pm
Re: CSS en resumen..
Éstos son algunos de buena referencia sobre CSS
Mozilla Developer Network
https://developer.mozilla.org
w3resource.com
http://www.w3resource.com/css/CSS-tutorials.php
Mozilla Developer Network
https://developer.mozilla.org
w3resource.com
http://www.w3resource.com/css/CSS-tutorials.php
Advertisement