Como integro xhtml y css

Apokalyptica79 · #1 (**permalink**) 19/08/2007, 13:05

Hola a todos antes que nada quiero aclarar que soy nueva en lo que a xhtml y css se refiere.
Me imprimi unos tutos, uno de xhtml y otro de css y me dice cuales son las opciones que tengo para integrar un documento .css en uno .html y yo opté por el método de hacer un texto externo .css para luego integrarlo al .html. Seguí leyendo pero no me dice como tengo que hacer para juntarlos, o sea me dice que tengo dos opciones que son: "link" y "style" y quiero probar las dos opciones, vi el ejemplo que me da pero como hago para que se vea en mi cambio en la página web? O sea como integro los efectos que hago en el .css en el .html?
Bueno espero alguien me pueda ayudar.
Desde ya muchas gracias a todos.

#2 (**permalink**) 19/08/2007, 14:21

En tu archivo HTML, entre <head> y </head>, agregás:

<link rel="stylesheet" media="screen" href="tu_archivo_css.css" type="text/css" />

Eso es todo lo que necesitás para vincular un archivo CSS a tu página.

Saludos.

Snd234 · #3 (**permalink**) 19/08/2007, 21:32

Otra forma, es poner entre las etiques <head> y </head> esto:

Código PHP:

  <style type="text/css">
@import "style.css";
</style>

style.css es el nombre de tu hoja de estilo externa.

Apokalyptica79 · #4 (**permalink**) 20/08/2007, 07:37

Hola, muchas gracias alvlin y Snd234 probé los dos y no tengo suerte, aunque es muy probable que yo esté haciendo algo mal. Les posteo mi .html y mi .css.
XHTML:

Cita:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title>GNU/Linux</title>
<link rel="stylesheet" media="screen" href="css.css" type="text/css" />
</head>

<body>
<p>
Es la denominación defendida por Richard Stallman y otros para el sistema operativo que utiliza el kernel Linux en conjunto con las aplicaciones del sistema creadas por el proyecto GNU y por muchos otros proyectos/grupos de software.
</p>

<h1>Historia</h1>
Desde 1984, Richard Stallman y muchos voluntarios están intentando crear un sistema operativo libre con un funcionamiento similar al UNIX, recreando todos los componentes necesarios para tener un sistema operativo funcional que se convertiría en el sistema operativo GNU. En el comienzo de los años 1990, después de seis años, GNU tenía muchas herramientas importantes listas, ocmo compiladores, depuradores, intérpretes de órdenes, etc, excepto por el componente central: el núcleo. Con el surgimiento del kernel Linux, esta laguna fue llenada y surgió el sistema operativo con el kernel Linux en conjunto con las herramientas GNU. De esta manera, Stallman juzga que este sistema operativo es una "versión modificada" del sistema GNU y por lo tanto debe tener la denominación GNU/Linux. Esta denominación resolvería la confusión entre el núcleo y el sistema operativo completo a que puede llevar, y de hecho ha llevado, la denominación Linux en solitario. Stallman también espera que con el parto del nombre GNU, se de al proyecto GNU que él encabeza el reconocimiento que merece por haber creado las aplicaciones de sistema imprescindibles para ser un sistema operativo compatible con UNIX.
</body>
</html>

CSS:

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo CSS</title>
<style type="text/css">
p { clor: red; font-family: Verdana; }
</style>
</head>

Bueno espero me puedan ayudar, muchas gracias.
Saludos.

buzu · #5 (**permalink**) 20/08/2007, 11:38

si, estas haciendo mal pero es sencillo solucionarlo.

el archivo .css no lleva mas que las reglas css, nada doctype ni ndad de lo que estas poniendo. borra todo de modo que te quede:

Código:

p { clor: red; font-family: Verdana; }

y nada mas.
fijate que la propiedad es color no clor

Snd234 Tu solucion es buena pero no creo que sea algo para nuestra amiga por ahora. Eso implica guardar la pagina con extencion php y para que valga la pena hacer eso devemos meter contenido dinamico y contrloar la pagina del lado del servidor. Para hacer las pruevas hay que tener un server en nuestra computadora o de otro modo nos dara dolores de cabeza el estar subiendo el sitio cada que queremos hacer una prueva.Como vez, no es algo para alguien que apenas empieza con CSS y XHTML. Quiza en un par de meses ya este lista pero por ahora no estoy seguro. Quiza me equivoque.

Apokalyptica79 · #6 (**permalink**) 20/08/2007, 12:37

Hola hice lo que buzu me dijo y quedó así:
XHTML:

Cita:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<link rel="stylesheet" media="screen" href="css.css" type="text/css" />
<title>GNU/Linux</title>
</head>

<body>
<p>
Es la denominación defendida por Richard Stallman y otros para el sistema operativo que utiliza el kernel Linux en conjunto con las aplicaciones del sistema creadas por el proyecto GNU y por muchos otros proyectos/grupos de software.
</p>

<h1>Historia</h1>
Desde 1984, Richard Stallman y muchos voluntarios están intentando crear un sistema operativo libre con un funcionamiento similar al UNIX, recreando todos los componentes necesarios para tener un sistema operativo funcional que se convertiría en el sistema operativo GNU. En el comienzo de los años 1990, después de seis años, GNU tenía muchas herramientas importantes listas, ocmo compiladores, depuradores, intérpretes de órdenes, etc, excepto por el componente central: el núcleo. Con el surgimiento del kernel Linux, esta laguna fue llenada y surgió el sistema operativo con el kernel Linux en conjunto con las herramientas GNU. De esta manera, Stallman juzga que este sistema operativo es una "versión modificada" del sistema GNU y por lo tanto debe tener la denominación GNU/Linux. Esta denominación resolvería la confusión entre el núcleo y el sistema operativo completo a que puede llevar, y de hecho ha llevado, la denominación Linux en solitario. Stallman también espera que con el parto del nombre GNU, se de al proyecto GNU que él encabeza el reconocimiento que merece por haber creado las aplicaciones de sistema imprescindibles para ser un sistema operativo compatible con UNIX.
</body>
</html>

CSS:

Cita:

<html>
<head>
<style type="text/css">
p { color: red; font-family: Verdana; }
</style>
</head>
</html>

No se si es así como me tiene que quedar o no, pero si es así tampoco veo el cambio.
Perdonen mi ignorancia en el tema pero trato de aprender.
Muchas gracias.

ssthormess · #7 (**permalink**) 20/08/2007, 12:51

No, no, y no. el CSS no lleva etiquetas de html. elimina html, head, style, etc. de modo de que solo quede esto

Código HTML:

  p { color: red; font-family: Verdana; }

Recuerda que CSS es "otro lenguaje" distinto de HTML, que se usen juntos es otra cosa.

Apokalyptica79 · #8 (**permalink**) 20/08/2007, 13:03

Hola y muchas gracias por tu ayuda pero sigue sin tomarme el cambio que le hice, dejé solo:

Cita:

p { color: red; font-family: Verdana; }

Como me dijeron y no pasa nada.
Voy a seguir con otro tema y después vuelvo a este.
Muchas gracias a todos.

#9 (**permalink**) 20/08/2007, 13:53

¿el archivo se llama css.css y está en la misma carpeta que la página html?

ssthormess · #10 (**permalink**) 20/08/2007, 14:24

El archivo debe estar en la ubicaion que especificas ;).

Apokalyptica79 · #11 (**permalink**) 20/08/2007, 18:42

Hola MUCHAS GRACIAS A TODOS por su ayuda y mi problema era que no puse el path completo de donde estaba el archivo .css.
Saludos.