Actividad3 S3U3 DPW 1

Nombre de la materia
Desarrollo de páginas web
Nombre de la Licenciatura
Ingeniería en sistemas Computacionales
Nombre del alumno

XXX
Matrícula
XXX
Nombre de la Tarea
Hojas de estilo
Unidad #
Unidad 3
Nombre del Profesor

XXXXXX
Fecha
XXX
Tarea 3
Unidad 3: Manejo de estilos en el diseñ o de pá ginas web
Desarrollo de pá ginas web
"Es difícil pensar en diseño, pero no pensar en ello, puede ser desastroso."
-- Ralph Caplan
Objetivos:
● Conocer los fundamentos del lenguaje de diseño CSS
● Conocer las principales propiedades de los selectores CSS.
Instrucciones:
● Orós, J. C. (2014). Propiedades de las hojas de estilo. Diseño de páginas Web con XHTML, JavaScript y CSS
(pp. 291- 304)
● Recio, J. A. (2016). El formato CSS3. HTML5, CSS3 y JQuery: curso práctico (pp. 93- 143)
Forma de evaluación:
Criterio Ponderación Calificación obtenida
P
Presentación 10%
Desarrollo de Actividad 90%
Actividad II
Ejercicio I 25%
Ejercicio II 25%
Ejercicio III 40%
Desarrollo de la actividad:
I. Identifica las características del lenguaje CSS .
Contesta las siguientes 5 cuestiones por medio de la lectura de los recursos en plataforma.
(Valor 25%)
● ¿Son los archivos responsables de definir la apariencia de una página web?
Las CSS (coding style sheets) u hojas de estilo en cascada son los archivos responsables de definir
la apariencia de una página web. Facilitan la gestión y la apariencia corporativa de un sitio web, ya
que todas las páginas de un sitio pueden compartir la misma hoja de estilos y los cambios de
apariencia quedan centralizados es estos archivos. Además, separan la presentación del contenido,
por lo que podemos cambiar la estética de una página sin tener que cambiar su contenido (HTML).
Una hoja de estilos no es más que un archivo de texto con extensión .css. Aunque las hojas de
estilo se definieron a mediados de los noventa, han tenido especial repercusión a partir de su
última versión (CSS3), en combinación con HTML5. Como ya veremos, gracias a las nuevas CSS
podremos aplicar incluso distintas hojas de estilo dependiendo del dispositivo en el que se presente
la página web (pantalla grande, móvil, papel…).
● ¿Indica a qué elementos se va a aplicar la regla de estilo?
Selector universal
Se define con * y se aplica a todos los elementos de la página
● ¿Permite aplicar un estilo único?
Selector de etiqueta HTML
Indica el estilo que se va a un elemento o etiqueta concreto.
P
● ¿Representan las posiciones o estados en los que se puede encontrar un elemento mientras se
visualiza en el navegador?
Pseudoclases
Existen selectores especiales para especificar elementos que tienen unas determinadas
propiedades. Son como clases “virtuales”, ya que no se especifican en el HTML, pero representan
las posiciones o estados en los que se puede encontrar un elemento mientras se visualiza en el
navegador.
● ¿Unidad de medida que establece el tamaño de acuerdo al tamaño de la fuente actual?
Los píxeles como tamaño para nuestra fuente
De forma tradicional se ha utilizado el píxel como la unidad de medida para el tamaño de las
fuentes. De hecho, los navegadores web suelen tener como valor por defecto para la fuente de un
documento, 16px.
II. Conocer las propiedades mas comunes de los selectores.
Describe las propiedades y valores listados en el cuadro, que pueden ser utilizadas por los
selectores.
Propiedades y valores de los selectores.
Etiquetas Descripción
font-style:italic; Convierte el texto en cursiva. Las opciones
son italic, oblique y normal.
font-weight: bold; Indica el grosor o anchura de una fuente. Los

valores son normal, bold, bolder, lighter o las
centenas comprendidas entre 100 y 900.
vertical-aling: 50%; Determina la alineación vertical. El valor
puede ser un porcentaje o una palabra clave
como baseline, middle, sub, super, text-top,
text-bottom, top, bottom.
P
background-image:textura.gif; Determina la alineación vertical. El valor

puede ser un porcentaje o una palabra clave
como baseline, middle, sub, super, text-top,
text-bottom, top, bottom.
border-botton-width: medium; Determinan el ancho del borde de un

elemento. Los valores para el ancho son thin,
medium y thick o una longitud.
display: none; Modo de mostrar la información en un bloque.
Los valores son block, inline, list-item y none.
Anote su descripción
III. Conocer las definiciones y propiedades nos permiten desarrollar hojas de estilo de forma
correcta.
Relaciona los conceptos con la descripción de la siguiente tabla ingresando el número

correspondiente a la respuesta correcta en los paréntesis. (Valor 40%)
P
Respuestas Definiciónes/Descripción
1.- !important
( 10 ) Medida que establece el tamaño en puntos
2.- font-size ( 5 ) Este posicionamiento permite acomodar los
elementos de una página según cambien las
dimensiones y orientación de la página.
3.- text-aling (7) Medida que establece el tamaño en píxeles.
4.- Lista de declaraciones ( 6 ) Es el modo de posicionamiento por defecto.
5.- flexbox ( 9) Se define con * y se aplica a todos los
elementos de la pagina.
6.- Estática ( 8 ) Para indicar las dimensiones de unos elementos
se utilizan estas propiedades.
7.- px (2) Propiedad que indica el tamaño de la fuente.
8.- width, height (1) Si un atributo tiene esta palabra clave se le da
mayor prioridad.
9.- Selector universal ( 4 ) Son pares propiedad:valor, separados por punto
y coma (;).
10.- pt (3 ) Propieda que indica la alineación horizontal del
texto.
Escriba las referencias bibliográficas (formato APA).
Orós Cabello, J. C. (2014). Diseño de páginas Web con XHTML, JavaScript y CSS. RA-MA
Editorial. Recuperado de https://elibro.net/es/ereader/utel/106414?page=292.

Actividad3 S3U3 DPW 1

Cargado por

Copyright:

Formatos disponibles

Actividad3 S3U3 DPW 1

Cargado por

Información del documento

Descripción original:

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Actividad3 S3U3 DPW 1

Cargado por

Copyright:

Formatos disponibles

Nombre de la materia

Desarrollo de páginas web

Nombre del alumno

Nombre del Profesor

Criterio Ponderación Calificación obtenida

Desarrollo de Actividad 90%

I. Identifica las características del lenguaje CSS .

● ¿Son los archivos responsables de definir la apariencia de una página web?

● ¿Indica a qué elementos se va a aplicar la regla de estilo?

Se define con * y se aplica a todos los elementos de la página

● ¿Permite aplicar un estilo único?

Selector de etiqueta HTML

Indica el estilo que se va a un elemento o etiqueta concreto.

● ¿Unidad de medida que establece el tamaño de acuerdo al tamaño de la fuente actual?

Los píxeles como tamaño para nuestra fuente

II. Conocer las propiedades mas comunes de los selectores.

Propiedades y valores de los selectores.

font-weight: bold; Indica el grosor o anchura de una fuente. Los

background-image:textura.gif; Determina la alineación vertical. El valor

border-botton-width: medium; Determinan el ancho del borde de un

Relaciona los conceptos con la descripción de la siguiente tabla ingresando el número

Escriba las referencias bibliográficas (formato APA).

También podría gustarte