CHTML-B-Ejercicio-CSSEjemplo2

•

Outros

0

marketingdigital1995

17/6/2023

¡Este material tiene más páginas!

Entonces, ¿te gustó este material?

Ayude a animar a otros estudiantes a mejorar el contenido

¿Te gustó este material? ¡Compartir! 🧡

Libros

93.136 Materiales compartidos

Descarga la aplicación para disfrutar aún más

Lea materiales sin conexión, sin usar Internet. Además de muchas otras características!

Vista previa del material en texto

www.globalmentoring.com.mx
www.globalmentoring.com.mx
Crear un programa para continuar practicando lo básico de 
estilos CSS. Al finalizar deberemos observar lo siguiente:
www.globalmentoring.com.mx
Vamos a crear el proyecto:
www.globalmentoring.com.mx
Vamos a crear el archivo estilos.css
www.globalmentoring.com.mx
( )
Vamos a crear el archivo estilos.css
www.globalmentoring.com.mx
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilos.css">
<!-- Prioridad 2: este es el segundo el prioridad -->
<style>
<!--
body{
font-family:"Bodoni MT Black";
color:#ff0000;
}
-->
</style>
<title>CSS Ejemplo 2</title>
</head>
<!-- el tag de body hereda las propiedades del archivo estilos.css -->
<body>
<h1>CSS Ejemplo 2</h1>
<!--Prioridad 1: estilo mas interno-->
<p style="font-family:Agency FB">
Este es un parrafo de ejemplo
</p>
</body>
</html>
Archivo index.html: Dar click para ir al código
http://icursos.net/cursos/HTML/Leccion03/IntroduccionCSS/CssEjercicio2/index.txt
www.globalmentoring.com.mx
/*
Se definen las propiedades de estilos.
Prioridad 3: Los estilos definidos en un archivo
aplican despues que los estilos definidos en el documento HTML
y tambien despues de los elementos definidos en un elemento HTML
*/
body {
background:#c0c0c0;
color:#000080;
font-family:"Century Gothic";
}
Archivo estilos.css: Dar click para ir al código
http://icursos.net/cursos/HTML/Leccion03/IntroduccionCSS/CssEjercicio2/estilos.css
www.globalmentoring.com.mx
El resultado es como sigue:
www.globalmentoring.com.mx
Inspeccionamos el párrafo de ejemplo y vemos como se 
sobreescriben los estilos:
www.globalmentoring.com.mx
( )
www.globalmentoring.com.mx
• Con este ejercicio hemos puesto en práctica la definición de 
estilos tanto dentro de un atributo html, en el archivo html, y 
en un archivo externo de tipo css.
• Con esto tenemos las bases para ir avanzando más respecto 
al tema de hojas de estilos CSS.
www.globalmentoring.com.mx
Por: Ing. Ubaldo Acosta