Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Primeros pasos con twitter bootstrap
Search
kuadrosx
June 28, 2012
Programming
140
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Primeros pasos con twitter bootstrap
kuadrosx
June 28, 2012
Other Decks in Programming
See All in Programming
Performance Engineering for Everyone
elenatanasoiu
0
250
A2UI という光を覗いてみる
satohjohn
1
170
トークンをケチるな、設計しろ:GitHub Copilotを賢く使うコンテキスト戦略
ochtum
0
270
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
geekplus_tech
0
420
Language Server 使ってる? 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
handlename
0
820
Observability in Practice:Grafana 與 Edge Device SRE 的那些事
blueswen
0
180
1B+ /day規模のログを管理する技術
broadleaf
0
120
過去最大のMCPアップデート! 2026-07-28 RC版の謎に迫る
licux
6
430
AI 輔助遺留系統現代化的經驗分享
jame2408
1
1.1k
代数的データ型って何が嬉しいの? #frontend_phpcon_do
kajitack
8
3.8k
AI がコードを書く時代における新卒エンジニアの仕事風景 (2026) / New Graduate Engineers in the Era of AI Coding (2026)
sushichan044
0
170
Creating Composable Callables in Contemporary C++
rollbear
0
180
Featured
See All Featured
Darren the Foodie - Storyboard
khoart
PRO
3
3.4k
What the history of the web can teach us about the future of AI
inesmontani
PRO
1
630
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Information Architects: The Missing Link in Design Systems
soysaucechin
0
990
Evolving SEO for Evolving Search Engines
ryanjones
0
230
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
210
4 Signs Your Business is Dying
shpigford
187
22k
The untapped power of vector embeddings
frankvandijk
2
1.8k
My Coaching Mixtape
mlcsv
0
160
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.8k
HDC tutorial
michielstock
2
730
Transcript
Primeros pasos con twitter bootstrap Jorge H. Cuadrado
¿Que es twitter bootstrap?
Obtener una plantilla inicial http://initializr.com/ • Seleccionár Bootstrap • Css
en lugar de less • Seleccionar plugins.js • Clic en "Download it!"
Entendiendo index.html y amigos • index.html: <head> y scripts •
modernirz+responds • plugins.js • chrome frame • bootstrap ◦ javacripts ◦ css ◦ imgs
Cuadricula (12) y layout
Cuadricula (12) y Layout .container .row .span4 .span8
Responsive design Layout Fluido • Layout: .container-fluid y .row-fluid
Responsive design Esconder o mostrar en: smartphone: ancho menor a
480px tablet: ancho menor a 767px desktop: ancho superior a 768px
Estilos básicos • Tipografias • Partes de Código • Tablas
• Formularios • Botones • Iconos
Componentes • Grupo de botones • Button dropdowns • Miniaturas
o Thumbnails • Navegación: Paginación, Tabs, Nav List
Javascript • Modal • Tooltips • Popover • Carrusel
¿Qué sigue? Preprocesadores: • css: Less o Sass • html:
Haml o Slim • javascript: coffeescript Javascript mvc frameworks: • http://backbonejs.org/ • http://emberjs.com/
Grandes cosas están por llegar http://yeoman.io/
¡Gracias y Happy Hacking! Jorge H. Cuadrado @kuadrosx http://preguntas.dev-co.org @nounproject