¿No entiendo? Aprendiendo CSS

Citar

Escrito el 06 Dic 2008 01:19 am

Antes que nada hola a todos

Resulta que estoy aprendiendo a crear Estilos CSS pero tengo un problema, a mi parecer es sencillo para algunos solo que no lo comprendo mucho.

Como ven en esta parte de los manuales dice:

1º http://www.cristalab.com/curso-html/colores-fondos-fuentes/
En este tutorial dice que con poner

Código :

strong {
    color: #fff;
    letter-spacing: 0.25 em;
    text-trasform: uppercase;
}

ya no tendria que preocuparme de editar al escribir que la letra me saldria del color elegido"Blanco" y que no tendria que procuparme en escribir en Mayuscula que me saldria todas las letras en minuscula

2º http://www.cristalab.com/curso-html/modelo-caja/
En este manual dice que con poner

Código :

img { border: none;}

ya no tendria que preocuparme por poner una imagen con vinculo y se aparesca su borde

Bien ahora lo ise y me quedo de este modo:

y en el Index coloque:

Pero reviso mi web y me queda asi:

Pero... que paso acaso no tenia que salirme la letra en minuscula de color blanco y la imagen sin borde?

¿Que me falta o en que cometi el error?

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 01:24 am

Creo que necesitas leer http://www.cristalab.com/tutoriales/94/tutorial-basico-de-css.html, luego si no entiendes pregunta.

Por Ramm

BOFH

3152 de clabLevel

6 tutoriales
8 articulos

Genero:Masculino Bastard Operators From Hell REC Héroes

Envíale un mensaje privado Web

London, UK

@ramono

Citar

Escrito el 06 Dic 2008 02:34 am

Hola chiguel pues el problema que hay es de entendimiento, te explico:

Código :

strong {
    color: #fff;
    letter-spacing: 0.25 em;
    text-trasform: uppercase;
}

Ese codigo lo que va a hacer es que el texto que escribas entre la etiqueta <strong></strong> tendrá las características que especificas.

chiguel escribió:

Código :

images {
   img { border: none; }
}

En esa segunda parte el error esta en images, tienes que quitarla con sus respectivas llaves ( { } ) pues no existe ninguna etiqueta (X)HTML con ese nombre, deberia ser así:

Código :

img { border: none; }

Mi consejo, espero no lo tomes a mal ya que no lo estoy haciendo con malas intenciones, lee detenidamente el tutorial, pues como dije anteriormente el problema fue que entendiste mal ciertas cosas... Saludos

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 02:54 am

Muchas gracias aprendi que se vincula con el Div ahora el problema es que no agarra todos los codigos un ejemplo

#

Código :

header {
       color: #CCC;
       font-size: 11px;
      font-family: Segoe UI;
      text-trasform: uppercase;
}

En este caso me aparece todo exepto text-transform: uppercase;

en el codigo html lo puse asi:

<div id="header">HELLO hola HELLO</div>

pero todos me salen como estan no me salen en minuscula todos.

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 03:12 am

Está mal escrito, es text-transform, te falta la "N"...

C Ya...

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 03:21 am

gracias brother te pasastes =) mm una pregunta siempre se enlaza los codigos css con el html por medio de DIV o aveces hay cosas que no...?

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 03:34 am

que diferencia hay entre colocar el . o el #?

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 03:35 am

No entiendo muy bien tu pregunta, si lo que quieres decir es que si siempre hay que utilizar DIVS cuando usas CSS la respuesta es no, las CSS lo que hace es darle estilo a los elementos (X)HTML, la gracia de utilizar DIVS es para maquetar tu pagina, mantenerla ordenada... Puedes probar, has en una pagina web cosas dentro de un DIV y cosas fuera, verás que las que están fuera como que descuadran la estructura de la pagina....

Y si lo que te refieres es que si para aplicar a los elementos (X)HTML {estos siempre deben estar dentro de un DIV pues la respuesta igual es no...

Código :

/* Esto eliminará el subrayado de los links estén dentro o fuera de un DIV*/
a { text-decoration: none; }

C Ya..!

Pd: No me paso, soy observador

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 03:45 am

bueno eso ya lo acabo de aprender pero bueno ya entiendo masomenos mmm
una consulta si en el body del CSS supuestamente es el que afecta a todos porque es que cuando pongo:

img { border: none; } en el body no afecta a las imagenes siguen apareciendo con el borde al costado.

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 03:45 am

Suponiendo que tienes esto en tu archivo CSS:

Código :

#header {
      color: #CCC;
      font-size: 11px;
      font-family: Segoe UI;
      text-trasform: uppercase;
}

.header {
      color: #FFF;
      font-size: 8px;
      font-family: sans-serif;
      text-trasform: lowercase;
}

Pasaria lo siguiente:

Código :

<!-- A este div se le aplicará el estilo de #header -->
<div id="header"> Contenido del div</div>

<!-- A este div se le aplicará el estilo de .header -->
<div class="header"> Contenido del div</div>

En resumen, los estilos definidos con #header se le aplican a los elementos que tengan el atributo id="header" y los estilos definidos con .header se le aplican a los elementos con el atributo class="header"

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 03:58 am

chiguel escribió:

bueno eso ya lo acabo de aprender pero bueno ya entiendo masomenos mmm
una consulta si en el body del CSS supuestamente es el que afecta a todos porque es que cuando pongo:

img { border: none; } en el body no afecta a las imagenes siguen apareciendo con el borde al costado.

Uhm... no se, gracias a ese codigo CSS las imagenes no deberían tener el borde al tener un link...

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 04:56 am

Mi codigo esta asi:

Código :

body {
    background-color: #000;
    background-image: url(/1/Temas/candes/images/bg_wood3.jpg);
    background-attachment: no-fixed;
    background-repeat: repeat;
    background-position: 0% 0%;
    img { border: none;
}
/*CSS sobre selector de identificador*/
#header {
       color: #CCC;
       font-size: 11px;
      font-family: Segoe UI;
      text-transform: uppercase;
}

el codigo de la imagen sin fondo esta en body que se dice que aplica los efectos a toda la web.

Por miguelsirna

315 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email Web

Hacker & Programmer

@miguelsirna

Citar

Escrito el 06 Dic 2008 02:50 pm

Lo que pasa es que img debe ir fuera del body, asi:

Código :

body {
    background-color: #000;
    background-image: url(/1/Temas/candes/images/bg_wood3.jpg);
    background-attachment: no-fixed;
    background-repeat: repeat;
    background-position: 0% 0%;
}
#header {
       color: #CCC;
       font-size: 11px;
      font-family: Segoe UI;
      text-transform: uppercase;
}
img { border: none; }

Saludos...

Por KB-27

Claber

301 de clabLevel

Envíale un mensaje privado

My very secret HQ

Citar

Escrito el 06 Dic 2008 03:47 pm

Hay una cosa que no dijiste respecto a los id y class, y es que class se puede repetir en varios elementos, mientras que id no, solo a un elemento

Por CarlosRuminott