http://codepen.io/Gabyler/pen/oxjRYj

 <div class="container">
<div class="jumbotron">
<div class="row">
<div class="col-md-12">
<h1 class="text-center">Steve Jobs</h1>
<h2 class="text-center"><em>The man who change the world</h2>
<div class="thumbnail">
<img src="http://img2.cache.netease.com/photo/0025/2013-09-23/99F1MDS70AK00025.jpg">
<div class="caption text-center">Jobs is an artist and a coder,without his passion and effort,the world can't be so wonderful like now.</div>
</div>
<div class="col-md-8 col-md-offset-2">
<h3>The timeline of Apple and him:</h3>
<ul>
<li><strong>1980</strong> -Presentation donated to Computer History Museum</li>
<li><strong>1983</strong> -International Design Conference in Aspen (IDCA) - 'The Future Isn't What It Used To Be' keynote</li>
<li><strong>1985</strong> -Playboy Magazine Interview</li>
<li><strong>1990</strong> -Memory & Imagination: New Pathways to the Library of Congress with Stewart Brand</li>
<li><strong>1994</strong> -Santa Clara Valley Historical Society Silicon Valley Documentary</li>
<li><strong>2005</strong>Stanford Commencement Address</li>
</ul>
<blockquote>
<p>Stay hungry, Stay foolish!</p>
<footer><cite>Barack Hussein Obama</cite></footer>
</blockquote>
<p class="text-center">If you want have a further information about jobs,this is <a href="https://en.wikipedia.org/wiki/Timeline_of_Steve_Jobs_media">wikipedia entry</a></p>
</div>
</div>
</div>
</div>
<!--jumbotron-->
<div class="footer text-center">
<p>This is coded by <a href="http://codepen.io/Gabyler/">Jiale Guo</a>
</p>
</div>
<!--container-->
</div>

Veiw HTML

body {
margin-top: 60px;
}

View Css

BootStrap框架写的致敬乔布斯的网页的更多相关文章

  1. 20170811 使用Bootstrap框架写个页面

    采用Bootstrap-table 做的页面. 1. 增加Query 查询功能,涉及Ajax 来加载页面数据吧! <meta charset="UTF-8">  < ...

  2. PHP实战 新闻管理系统 使用到了bootstrap框架

    刚刚接触 PHP 仿照视频 写了个新闻管理系统 当中也使用到了bootstrap框架 写下来整理一下思路. 这是个非常easy的系统.首先是建立数据库表. mysql>create databa ...

  3. Bootstrap框架的学习(一)

    一.Bootstrap框架介绍 Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架. 二.简单介绍 Bootstrap框架是属 ...

  4. BootStrap框架

    简介: Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷,是一个CSS ...

  5. Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单

    一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...

  6. Bootstrap框架(基础篇)之列表,表格,表单

    继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...

  7. css去掉使用bootstrap框架后打印网页时预览效果下的超链接

    在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...

  8. 【乔布斯05年斯坦福大学毕业典礼上的演讲】——Stay Hungry, Stay Foolish.(转)

    Steve Jobs: Commencement Address at Stanford University "Stay Hungry, Stay Foolish." 求知若饥, ...

  9. Bootstrap 框架 栅格布局系统设计原理

    如果你是初次接触Bootstrap,你一定会为它的栅格布局感到敬佩.事实上,这个布局系统提供了一套响应式的布局解决方案. 既然这么好用,那他是如何用CSS来实现的呢? 我特意去Bootstrap官方下 ...

随机推荐

  1. U盘启动盘的制作与U盘重装系统

    网上有各种各样的装系统的方法,也有各种不同的操作系统版本. 本文介绍如何有UtraISO将U盘制作成系统启动盘,本文用于制作的系统是纯净的32位win7旗舰版. 可到http://itellyou.c ...

  2. Kindeditor+web.py+SAE Storage 实现文件上传 - 开源中国社区

    Kindeditor+web.py+SAE Storage 实现文件上传 - 开源中国社区 Kindeditor+web.py+SAE Storage 实现文件上传

  3. 格而知之5:我所理解的Run Loop

    1.什么是Run Loop? (1).Run Loop是线程的一项基础配备,它的主要作用是来让某一条线程在有任务的时候工作.没有任务的时候休眠. (2).线程和 Run Loop 之间的关系是一一对应 ...

  4. Qemu之Network Device全虚拟方案三: I/O虚拟化

    前面两文主要对前端网络流的数据路径和虚拟网卡的创建进行了说明,这些能够看做是Guest OS网络数据包收发的准备工作,那么网络数据包是怎样在Guest OS中进进出出的呢,本文就是重点讲述Guest ...

  5. excel笔记

    提取单元格中的数字部分 =MID(LOOKUP(1,-(1&MID(A1,MIN(FIND({0;1;2;3;4;5;6;7;8;9},A1&1/17)),ROW($1:$15)))) ...

  6. 详解AJAX核心 —— XMLHttpRequest 对象 (上)

    我要说的内容都是非常基础的内容,高手就免看了,如果看了欢迎给点意见啊.新手或者对低层还不是很了解的人可以看看,帮助理解与记忆. XMLHttpRequest 对象是AJAX功能的核心,要开发AJAX程 ...

  7. Entity Framework排序

    public ActionResult Index() { using (ApplicationDbContext db = new ApplicationDbContext()) { //var l ...

  8. Lua编译

    编译lua包含3部分内容:lua库文件(lua*.lib),lua解释器(lua.exe),lua编译器(luac.exe) 首先: 下载源代码,编译批处理(以5.2.3为例): cd srccl / ...

  9. Gengxin讲STL系列——String

    衔接上一篇引导. 作为第一篇博客,就要大气一点. 可我好像并不知道怎么才能让自己的博客大气一点= =: 明天是我生日,自己先买个中文域名庆祝了一下…… 好了,废话说完了,结果博客也没大气到哪去……,正 ...

  10. [转载]string转化大小写(C++)

    如何将一个字符串转换成大写或者小写?这是字符串匹配中经常需要做的事情,然而C++的Standard Library并没有提供将std::string转成大写和小写的功能,只有在提供将char转成大写( ...