Universidad Marino Galvez de Guatemala

Facultad de ingeniería en Sistemas

Plan sábado
Campus Villa Nueva
Programacion II

Investigación

Nombre: Jhosseff Ottoniel Orantes Aragón

Carnet: 6691-20-17260
Introducción

Este trabajo esta hecho con el fin de crear conocimientos sobre el tema de estilos dentro
de La creación de una aplicación o pagina web y se determinaran temas principales sobre
los temas de diseño css y Boostrab, Esto ayudara a comprender los temas más básicos
que se han implementado de estos dentro del curso. Estos tipos de lenguajes van de la
mano con HTML, y son muy útiles para los diseños de los mismos, a continuación los
temas detallados.
CSS - Cascading Style Sheets
CSS son las siglas en inglés de Cascading Style Sheets, que significa «hojas de esilo en
cascada. Es un lenguaje que se usa para estilizar elementos escritos en un lenguaje de
marcado como HTML.
CSS fue desarrollado por World Wide Web Consortium en 1996 por una razón muy
sencilla. HTML no fue diseñado para tener etiquetas que ayuden a formatear la página.
Está hecho solo para escribir el marcado para el sitio. Y este lenguaje nos ayuda a poder
darle forma a este tiempo de lenguaje para que sea mas agradable y también fácil de usar
para el usuario ya que eso es lo que siempre se busca dentro de cualquier programa o
pagina que sea amigable para quienes lo usen.

La relación entre HTML y CSS es muy fuerte. Dado que HTML es un lenguaje de marcado
es decir, constituye la base de un sitio y CSS enfatiza el estilo toda la parte estética de un
sitio web, van de la mano. CSS juega un papel muy importante dentro de la creación de
contenido web.
Antes de CSS, todo el estilo debía incluirse en el marcado HTML. Esto significa que había
que describir por separado todos los fondos, los colores de fuente, las alineaciones, etc.
Esto ayuda mucho a los desarrolladores dentro de su trabajo todos los días y siempre nos
hemos topado con este lenguaje al usar un dispositivo y usar una página web.
con CSS no tienes que describir repetidamente cómo se ven los elementos individuales.
Esto ahorra tiempo, hace el código más corto y menos propenso a errores.
CSS utiliza una sintaxis simple basada en el inglés con un conjunto de reglas que la
gobiernan. Como mencionamos anteriormente, HTML no fue hecho con la intención de
utilizar elementos de estilo, sino solo para el marcado de la página. Fue creado
simplemente para describir el contenido.
Dentro del CSS se puede hacer muchas cosas desde darle forma y tamaño a figuras hasta
hacer animaciones con el mismo lenguaje, nos permite hacer muchas cosas visuales.
 Ejemplo de CSS
En este ejemplo se implementa el CSS en el mismo documento

 
Otro ejemplo de como dar estilos CSS
Boostrap

Bootstrap es un framework front-end utilizado para desarrollar aplicaciones web y sitios

mobile first, o sea, con un layout que se adapta a la pantalla del dispositivo utilizado por el
usuario.
El framework combina CSS y JavaScript para estilizar los elementos de una página HTML.
Permite mucho más que, simplemente, cambiar el color de los botones y los enlaces.
Esta es una herramienta que proporciona interactividad en la página, por lo que ofrece
una serie de componentes que facilitan la comunicación con el usuario, como menús de
navegación, controles de página, barras de progreso y más.
Además de todas las características que ofrece el framework, su principal objetivo es
permitir la construcción de sitios web responsive para dispositivos móviles.
Esto significa que las páginas están diseñadas para funcionar en desktop, tablets y
smartphones, de una manera muy simple y organizada.

Funcionamiento
Bootstrap está constituido por una serie de archivos CSS y JavaScript responsables de
asignar características específicas a los elementos de la página.
Hay un archivo principal llamado bootstrap.css, que contiene una definición para todos los
estilos utilizados. Básicamente, la estructura del framework se compone de dos
directorios:
css: contiene los archivos necesarios para la estilización de los elementos y una alternativa
al tema original;
js: contiene la parte posterior del archivo bootstrap.js (original y minificado), responsable
de la ejecución de aplicaciones de estilo que requieren manipulación interactiva.

Bootstrap ofrece una serie de características que se pueden implementar en un sitio web.
Nos ofrece mucho para implementar dentro del desarrollo ya que nos ofrece un poco mas
de opciones que CSS para desarrollar.
Ejemplo
Aquí se puede ver un poco de la implementación de Bootstrap dentro de HTML

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Plantilla básica de Bootstrap</title>

<!-- CSS de Bootstrap -->

<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->

<!--[if lt IE 9]>

<script

src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
 <script

src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

<![endif]-->

</head>

<body>

<h1>¡Hola mundo!</h1>

<!-- Librería jQuery requerida por los plugins de JavaScript -->

<script src="http://code.jquery.com/jquery.js"></script>

<!-- Todos los plugins JavaScript de Bootstrap (también puedes

incluir archivos JavaScript individuales de los únicos

plugins que utilices) -->

<script src="js/bootstrap.min.js"></script>

</body>

</html>
Conclusión

En conclusión, CSS es un tipo de tecnología que nos ayuda a separar la estructura de la

presentación que se le da al usuario, mejora las funciones de la pagina y su visualización y
le da una buena experiencia al usuario al momento de usar un sitio web, dando paso al
desarrollo web responsive y disminuyendo del procesamiento y el tiempo de carga dentro
de el desarrollo.
Bootstrap también nos ofrece mucho dentro de el desarrollo web y nos ayuda con la
estructura visual que va a tener la pagina web,  BootStrap es una gran opción en cuanto
a lo que frameworks para el front end se refiere. Su configuración es fácil de entender y
de manejar.
Estos dos tipos de tecnología son muy buenos y son los que le dan forma a los
proyectos hechos con HTML, sin estos nunca se nos haría tan fácil usar una web, y su
uso en diferentes dispositivos.
E-grafia

Estas son algunas paginas utilizadas para la realización de este trabajo de investigación:

https://medium.com/laboratoria-how-to/introducci%C3%B3n-a-css-parte-i-
72bcbdd3b691
pagina de información educativa
informática Web

https://www.hostinger.es/tutoriales/que-es-css
pagina de información educativa
informática Web

https://getbootstrap.com/
pagina de información desarrollo web
informática Web

https://rockcontent.com/es/blog/bootstrap/

pagina de información desarrollo web

informática Web