Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

BOOTSTRAP

No description
by

VICTOR GALVAN MEXICANO

on 17 July 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of BOOTSTRAP

Notes
Ideas
BOOTSTRAP
Introducción
Es un framework que permite crear interfaces web con CSS y Javascript que adaptan la interfaz dependiendo del tamaño del dispositivo en el que se visualice de forma nativa, es decir, automáticamente se adapta al tamaño de un ordenador o de una Tablet sin que el usuario tenga que hacer nada, esto se denomina diseño adaptativo o Responsive Design.
Introducción
Este un conjunto de herramientas se utiliza para desarrollar aplicaciones web y sitios rápidamente, para la creación de redes, diseños, tipografías, tablas, formularios, navegación, alarmas, etc.
Historia
Bootstrap fue desarrollado por Mark Otto y Jacbod Thornton de Twitter, como un marco de trabajo (framework) para fomentar la consistencia a través de herramientas internas. Antes de Bootstrap, se usaban varias librerías para el desarrollo de interfaces de usuario, las cuales guiaban a inconsistencias y a una carga de trabajo alta en el mantenimiento de las mismas.
Utilización
Bootstrap se crea con navegadores modernos en mente, tiene un soporte relativamente incompleto para HTML5 y CSS 3, pero es compatible con la mayoría de los navegadores web, Así que funciona a la perfección con todas las versiones modernas de Chrome, Firefox, Safari, Opera e Internet Explorer.
Funcionamiento
Funcionamiento
Galvan Mexicano Victor
Montecillo Monroy Ernesto
Navarrete Herman Christian Adriana
Pizano Mendoza Eduardo Damian
Damian Rojas Roberto

Los diseños creados con Bootstrap son simples, limpios e intuitivos, esto les da agilidad a la hora de cargar y al adaptarse a otros dispositivos. Para ello nos ofrece una serie de plantillas CSS y de ficheros JavaScript, los cuales nos permiten conseguir:

•Interfaces que funcionen de manera brillante en los navegadores actuales, y correcta en los no tan actuales.

•Un diseño que pueda ser visualizado de forma correcta en distintos dispositivos y a distintas escalas y resoluciones.

•Una mejor integración con las librerías que se suelen usar habitualmente, como por ejemplo jQuery.

•Un diseño sólido basado en herramientas actuales y potentes como LESS o estándares como CSS3/HTML5

Bootstrap es modular y consiste esencialmente en una serie de hojas de estilo LESS que implementan la variedad de componentes de la herramienta. Una hoja de estilo llamada bootstrap.less incluye los componentes de las hojas de estilo. Los desarrolladores pueden adaptar el mismo archivo de Bootstrap, seleccionando los componentes que deseen usar en su proyecto.
Funcionamiento
Un sitio web tiene muchos elementos diferentes, tales como encabezados, listas, tablas, botones, formularios, etc. Todos estos elementos HTML fundamentales son decorados y mejorados con clases extensibles.
Funcionamiento
Los elementos HTML de las que proporcionan los estilos son:

•Tipografía

•Código

•Tablas

•Formas

•Botones

•Imágenes

•Iconos
Lo primero es descargar bootstrap desde el sitio principal:


•http://twitter.github.io/bootstrap/index.html

Instalación
Otra opción para descargar bootstrap es clonar el repositorio, el cual lo hacemos con los siguientes comandos:

•cd documents

•cd github

•git clone git://github.com/twitter/bootstrap.git

Instalación
Para poder usar bootstrap en nuestro sitio que desarrollaremos, lo que se tiene que hacer es copiar dos archivos:
Elementos
En su GitHub oficial se puede encontrar páginas con toda la información necesaria para utilizar Bootstrap en los propios proyectos web, además también se puede encontrar ejemplos de utilización de este Framework.

•https://github.com/twitter/bootstrap
Elementos
Claramente el mejor ejemplo de utilización de Bootstrap es Twitter, pero existen otros sitios que implementan diseños responsive basados en este Framework como por ejemplo:

•Breezi: http://breezi.com/

•Stackideas: http://stackideas.com/

•iAcquire: http://www.iacquire.com/

•MonitorBacklinks: http://monitorbacklinks.com/

•AudioMack: http://www.audiomack.com/

•LearnDot: http://www.learndot.com/

Instalación
Instalación
Después de que se ha descargado el archivo bootstrap.zip hay que descomprimirlo y ahora se tendrá una carpeta llamada bootstrap.
Original Destino

bootstrap/css/bootstrap.min.css nombre_del_proyecto_html/css
bootstrap/js/bootstrap.min.js nombre_del_proyecto_html/js

Elementos
El Framework trae varios elementos con estilos predefinidos fáciles de configurar: botones, menús desplegables, formularios incluyendo todos sus elementos e integración jquery para ofrecer ventanas y tooltips dinámicos.
GRACIAS POR SU
ATENCION :D
Full transcript