SlideShare una empresa de Scribd logo
EJERCICIOS EN CSS
EJERCICIO1

Deseo obtener un archivo con Fondo sea amarillo, y que el texto contenido en ella sea de 10 puntos de
altura y de la fuente Arial, con márgenes izquierdo y derecho de media pulgada. Esto afectará a todo lo
que está contenido entre <BODY> y </BODY>, o sea a toda la página.
EJERCICIO2 – COMO LO LOGRAMOS?????

Esto es un párrafo con varias palabras en color azul oscuro. resulta muy fácil.
EJERCICIO3 – QUE OBTENEMOS????

<p>
Esto es un párrafo en varias palabras <SPAN style="color:green">en color verde</SPAN>.
resulta muy fácil.
</p>
EJERCICIO4 – COMO LO LOGRAMOS?????

<p style="color:#990000">
Esto es un párrafo de color rojo.
</p>
<p style="color:#000099">
Esto es un párrafo de color azul.
</p>

EJERCICIO5 – AL INSERTAR EL CÓDIGO QUE SE OBTIENE???????

<html>
<head>
<title> Título de la página </title>
<style type="text/css">
<!--
body {background: black; font-size: 10pt; font-family: Arial,Helvetica,sans-serif; color: yellow; text-
align:justify; margin-left: 0.5in; margin-right: 0.5in}
H1 {background: aqua; font-size: 14pt; font-weight: bold; color: orange}
H2 {font-size: 12pt; font-weight: bold; color: white}
-->
</style>
</head>
<body>
Conjunto de etiquetas del cuerpo de la página
</body>
</html>
EJERCICIO6 – QUE OBTENEMOS AL TRABAJAR EL SIGUIENTE CÓDIGO

<style type='text/css'>
body {
  background-color:#345485;
}

h1 {
  color:orange;
  font-family:'Times New Roman';
  text-align:center;
}

p{
  color:#E9EBAB;
  font-family:Arial,Helvetica,sans-serif;
  font-size:20px;
  text-align:center;
}
</style>
EJERCICIO7 – QUE OBTENEMOS?????

body {
  background: transparent url('COLOCAR UNA IMAGEN.EXT') no-repeat center
        background-attachment: fixed;
}

h1 {
  color:red;
  font-family:'Times New Roman';
  font-size:24px;
  font-weight:bold;
  text-align:center;
}

h2 {
  color:blue;
  font-family:Verdana, Geneva, sans-serif;
  font-size:20px;
  font-weight:bold;
  text-align:center;
}

p{
  color:black;
  font-family:Arial, Helvetica, sans-serif;
  font-size:18px;
  text-align:center;
}
DESEO LOGRAR LO SIGUIENTE, ¿QUÉ DEBEMOS HACER?
P{
font-size : 12pt;
font-family : arial,helvetica;
font-weight : normal;
}
H1 {
font-size : 36pt;
font-family : verdana,arial;
text-decoration : underline;
text-align : center;
background-color : Teal;
}
BODY {
background-color : #006600;
font-family : arial;
color : White;
}

Más contenido relacionado

TXT
DOCX
Colegio nacional nicolás esguerra (1)
DOCX
Guía Práctica - 3°- 4°- 5° - Primaria
PDF
Html actividades 1
PDF
Ejercicios htm lcompletos
DOC
Proceso transversal wh computo
PDF
Html actividades 1
Colegio nacional nicolás esguerra (1)
Guía Práctica - 3°- 4°- 5° - Primaria
Html actividades 1
Ejercicios htm lcompletos
Proceso transversal wh computo
Html actividades 1

Similar a Ejercicios en css (20)

PDF
Introducción a CSS en XHTML
PDF
Introduccion a css
PDF
Laboratorio 03
PDF
Html, css y tablas.compressed
PDF
MEJORES - Curso-HTML-+-CSS.pdf
PDF
Curso-HTML--CSS.pdf
DOCX
Pagina con maquetacion
PPTX
Get & post
DOCX
Comando y ejercicios para HTML
PPTX
Presentacion html
PPTX
DIRECTIVAS BASICAS HTML
PPTX
Presentacion html
PPTX
Presentacion html
PDF
Ejercicio denisse chacaguasay 3_c
PPSX
Etiquetas básicas en html
PDF
PDF
Fundamentos de CSS
PDF
Modulo1parte2ver2 140505061829-phpapp02
PDF
Directivas en html
PPTX
Hipervinculos
Introducción a CSS en XHTML
Introduccion a css
Laboratorio 03
Html, css y tablas.compressed
MEJORES - Curso-HTML-+-CSS.pdf
Curso-HTML--CSS.pdf
Pagina con maquetacion
Get & post
Comando y ejercicios para HTML
Presentacion html
DIRECTIVAS BASICAS HTML
Presentacion html
Presentacion html
Ejercicio denisse chacaguasay 3_c
Etiquetas básicas en html
Fundamentos de CSS
Modulo1parte2ver2 140505061829-phpapp02
Directivas en html
Hipervinculos
Publicidad

Más de Claretiano (14)

DOCX
ACTIVIDAD 333333 - MBLOCK_S3 grupo1.docx
DOCX
IMPRIME.docx
PDF
Ac fr ogbyraalr9kj-rcmkfpy42a_0d8ffpeyo8jghfriozd978fytck36sjil-v7k1te_vpkq6v...
DOCX
Practica sesion6
DOCX
Computo2.0
DOCX
Practica sesion6
DOCX
Practica1 5 p
DOCX
Com08 docentes
DOCX
Recomendaciones1
DOCX
La Web4.0
DOCX
Manual Crear Blogs
PPTX
Ht ml exposicion_2011
DOC
Programacion Estructurada
DOC
Introduccion Programacion
ACTIVIDAD 333333 - MBLOCK_S3 grupo1.docx
IMPRIME.docx
Ac fr ogbyraalr9kj-rcmkfpy42a_0d8ffpeyo8jghfriozd978fytck36sjil-v7k1te_vpkq6v...
Practica sesion6
Computo2.0
Practica sesion6
Practica1 5 p
Com08 docentes
Recomendaciones1
La Web4.0
Manual Crear Blogs
Ht ml exposicion_2011
Programacion Estructurada
Introduccion Programacion
Publicidad

Último (20)

PPTX
Presentación de la Cetoacidosis diabetica.pptx
PDF
Escuela de Negocios - Robert kiyosaki Ccesa007.pdf
PDF
GUIA DE: CANVA + INTELIGENCIA ARTIFICIAL
PDF
Crear o Morir - Andres Oppenheimer Ccesa007.pdf
PDF
Guia de Tesis y Proyectos de Investigacion FS4 Ccesa007.pdf
PDF
biología es un libro sobre casi todo el tema de biología
PDF
Atencion prenatal. Ginecologia y obsetricia
PDF
DI, TEA, TDAH.pdf guía se secuencias didacticas
PDF
Tomo 1 de biologia gratis ultra plusenmas
PDF
Unidad de Aprendizaje 5 de Educacion para el Trabajo EPT Ccesa007.pdf
PDF
TRAUMA_Y_RECUPERACION consecuencias de la violencia JUDITH HERMAN
PDF
Didactica de la Investigacion Educativa SUE Ccesa007.pdf
PDF
1. Intrdoduccion y criterios de seleccion de Farm 2024.pdf
DOCX
V UNIDAD - PRIMER GRADO. del mes de agosto
PDF
OK OK UNIDAD DE APRENDIZAJE 5TO Y 6TO CORRESPONDIENTE AL MES DE AGOSTO 2025.pdf
PDF
Cronograma de clases de Práctica Profesional 2 2025 UDE.pdf
PDF
5°-UNIDAD 5 - 2025.pdf aprendizaje 5tooo
PDF
Educación Artística y Desarrollo Humano - Howard Gardner Ccesa007.pdf
PDF
Habitos de Ricos - Juan Diego Gomez Ccesa007.pdf
PDF
SESION 12 INMUNIZACIONES - CADENA DE FRÍO- SALUD FAMILIAR - PUEBLOS INDIGENAS...
Presentación de la Cetoacidosis diabetica.pptx
Escuela de Negocios - Robert kiyosaki Ccesa007.pdf
GUIA DE: CANVA + INTELIGENCIA ARTIFICIAL
Crear o Morir - Andres Oppenheimer Ccesa007.pdf
Guia de Tesis y Proyectos de Investigacion FS4 Ccesa007.pdf
biología es un libro sobre casi todo el tema de biología
Atencion prenatal. Ginecologia y obsetricia
DI, TEA, TDAH.pdf guía se secuencias didacticas
Tomo 1 de biologia gratis ultra plusenmas
Unidad de Aprendizaje 5 de Educacion para el Trabajo EPT Ccesa007.pdf
TRAUMA_Y_RECUPERACION consecuencias de la violencia JUDITH HERMAN
Didactica de la Investigacion Educativa SUE Ccesa007.pdf
1. Intrdoduccion y criterios de seleccion de Farm 2024.pdf
V UNIDAD - PRIMER GRADO. del mes de agosto
OK OK UNIDAD DE APRENDIZAJE 5TO Y 6TO CORRESPONDIENTE AL MES DE AGOSTO 2025.pdf
Cronograma de clases de Práctica Profesional 2 2025 UDE.pdf
5°-UNIDAD 5 - 2025.pdf aprendizaje 5tooo
Educación Artística y Desarrollo Humano - Howard Gardner Ccesa007.pdf
Habitos de Ricos - Juan Diego Gomez Ccesa007.pdf
SESION 12 INMUNIZACIONES - CADENA DE FRÍO- SALUD FAMILIAR - PUEBLOS INDIGENAS...

Ejercicios en css

  • 1. EJERCICIOS EN CSS EJERCICIO1 Deseo obtener un archivo con Fondo sea amarillo, y que el texto contenido en ella sea de 10 puntos de altura y de la fuente Arial, con márgenes izquierdo y derecho de media pulgada. Esto afectará a todo lo que está contenido entre <BODY> y </BODY>, o sea a toda la página. EJERCICIO2 – COMO LO LOGRAMOS????? Esto es un párrafo con varias palabras en color azul oscuro. resulta muy fácil. EJERCICIO3 – QUE OBTENEMOS???? <p> Esto es un párrafo en varias palabras <SPAN style="color:green">en color verde</SPAN>. resulta muy fácil. </p> EJERCICIO4 – COMO LO LOGRAMOS????? <p style="color:#990000"> Esto es un párrafo de color rojo. </p> <p style="color:#000099"> Esto es un párrafo de color azul. </p> EJERCICIO5 – AL INSERTAR EL CÓDIGO QUE SE OBTIENE??????? <html> <head> <title> Título de la página </title> <style type="text/css"> <!-- body {background: black; font-size: 10pt; font-family: Arial,Helvetica,sans-serif; color: yellow; text- align:justify; margin-left: 0.5in; margin-right: 0.5in} H1 {background: aqua; font-size: 14pt; font-weight: bold; color: orange} H2 {font-size: 12pt; font-weight: bold; color: white} --> </style> </head> <body> Conjunto de etiquetas del cuerpo de la página </body> </html>
  • 2. EJERCICIO6 – QUE OBTENEMOS AL TRABAJAR EL SIGUIENTE CÓDIGO <style type='text/css'> body { background-color:#345485; } h1 { color:orange; font-family:'Times New Roman'; text-align:center; } p{ color:#E9EBAB; font-family:Arial,Helvetica,sans-serif; font-size:20px; text-align:center; } </style> EJERCICIO7 – QUE OBTENEMOS????? body { background: transparent url('COLOCAR UNA IMAGEN.EXT') no-repeat center background-attachment: fixed; } h1 { color:red; font-family:'Times New Roman'; font-size:24px; font-weight:bold; text-align:center; } h2 { color:blue; font-family:Verdana, Geneva, sans-serif; font-size:20px; font-weight:bold; text-align:center; } p{ color:black; font-family:Arial, Helvetica, sans-serif; font-size:18px; text-align:center; }
  • 3. DESEO LOGRAR LO SIGUIENTE, ¿QUÉ DEBEMOS HACER? P{ font-size : 12pt; font-family : arial,helvetica; font-weight : normal; } H1 { font-size : 36pt; font-family : verdana,arial; text-decoration : underline; text-align : center; background-color : Teal; } BODY { background-color : #006600; font-family : arial; color : White; }