bootstrap3文章
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<link rel="stylesheet" href="css/bootstrap.css" />
<script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
<style>
.a{
border: 1px solid #DDDDDD;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-9 col-lg-9 col-sm-9 col-xs-12 ">
<h2 class="text-primary text-center">日本女孩研发狗狗机器人,告诉你今天体味如何?</h2>
<div>
<p class="text-muted ">
或许纯粹用机器测定你身上有无臭味,还不能激发人的耻度,但日本一家建设公司旗下的「CrazyLabo」疯狂实验室与北九州工业高等专门学校合作推出的人形与狗形气味探测机器人,将激发你内心最深处的羞耻感(或挫败感)!
</p>
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12 col-lg-12 text-center">
<img src="img/sample-image.jpg" class="img-thumbnail" />
</div>
</div>
<p class="text-muted">
图中的这位可爱的女孩叫做「香织」,虽然被她眼睛直视感觉怪恐怖的,但微启的双唇,其实内部藏有气味探测装置。对她的双唇间吹气后,香织会从好到坏四个层次中归类你的口气。若你是香织的菜,她会告诉你:「柑橘般的酸甜滋味」(恋爱了?);但太糟糕也会实话实说,毕竟她还不会说谎啊!
</p>
<p class="text-muted">
相对于异常恐怖的香织,狗形气味机器人就可爱多啦。主要的功用是闻闻你的脚味,虽然它不会说话,但会以肢体语言表达感受。当刚穿上袜子给它嗅嗅,通常会开心地对你叫几声。但最糟的情况下,它会直接气绝身亡,背景音乐将拨放萧邦的送葬进行曲。虽然表达形式有种恶搞的感觉,但点击来源连结观看朝日新闻的视频,你应该会笑出来!
</p>
</div>
<div>
<h4 class="text-muted">文章导航</h4>
<div class="row">
<div class="col-md-4 col-lg-4 col-sm-4 col-xs-12">
<img src="img/1.jpg" class="img-thumbnail" />
</div>
<div class="col-md-4 col-lg-4 col-sm-4 col-xs-12">
<img src="img/2.jpg" class="img-thumbnail" />
</div>
<div class="col-md-4 col-lg-4 col-sm-4 col-xs-12">
<img src="img/3.jpg" class="img-thumbnail" />
</div>
</div>
</div>
</div>
<div class="col-md-2 col-lg-2 col-sm-2 col-xs-12 col-lg-offset-1 a">
<h4 class="text-muted text-center">随手文章 </h4>
</div>
</div>
</div>
</body>
</html>
bootstrap3文章的更多相关文章
- MVC5 + EF6 + Bootstrap3 (16) 客户端验证
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-client-side-validation.html 系列 ...
- MVC5 + EF6 + Bootstrap3 (15) 应用ModelState和Data Annotation做服务器端数据验证
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-server-side-validation.html 系列 ...
- MVC5 + EF6 + Bootstrap3 (14) 分部视图PartialView
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-partialview.html 系列教程:MVC5 + E ...
- MVC5 + EF6 + Bootstrap3 (13) 查看详情、编辑数据、删除数据
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-rud.html 系列教程:MVC5 + EF6 + Boo ...
- MVC5 + EF6 + Bootstrap3 (12) 新建数据
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-create.html 系列教程:MVC5 + EF6 + ...
- MVC5 + EF6 + Bootstrap3 (10) 数据查询页面
文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-search-page.html 系列教程:MVC ...
- MVC5 + EF6 + Bootstrap3 (9) HtmlHelper用法大全(下)
文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-httphelper-part2.html 上一节 ...
- MVC5 + EF6 + Bootstrap3 (8) HtmlHelper用法大全(上)
文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-httphelper-part1.html 上一节 ...
- MVC5 + EF6 + Bootstrap3 (7) Bootstrap的栅格系统
文章来源: Slark.NET-博客园http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-grid.html 上一节:ASP.NET MVC ...
随机推荐
- [转] initrd详解
转自:http://www.cnblogs.com/leaven/archive/2010/01/07/1641324.html 在Linux操作系统中,有一项特殊的功能——初始化内存盘INITRD( ...
- Linux学习笔记:Shell脚本学习
概念 真正能够控制计算机硬件(CPU.内存.显示器等)的只有操作系统内核(Kernel),图形界面和命令行只是架设在用户和内核之间的一座桥梁. 由于安全.复杂.繁琐等原因,用户不能直接接触内核(也没有 ...
- Servet-------JSTL标签库
JSTL标签库 也可以和EL表达式配合使用 作用: 提高在Jsp中的逻辑代码的编写效率,使用标签..(对EL表达式的扩展) 使用: JSTL的核心标签库(重点) JSTL的SQL标签库 JST ...
- 2018.11.17 hdu5829Rikka with Subset(ntt)
传送门 nttnttntt基础题. 考虑计算每一个数在排名为kkk时被统计了多少次来更新答案. 这样的话,设anskans_kansk表示所有数的值乘上排名为kkk的子集数的总和. 则ansk=∑i ...
- 牛客训练:小a与黄金街道(欧拉函数+快速幂)
题目链接:传送门 思路:欧拉函数的性质:前n个数的欧拉函数之和为φ(n)*n/2,由此求出结果. 参考文章:传送门 #include<iostream> #include<cmath ...
- Python-IDLE实现清屏
1.将下面文件复制到命名为ClearWindow.py的文件下,移动到 …Python\Python36-32\Lib\idlelib下. ############################## ...
- CodeCraft-19 and Codeforces Round #537 (Div. 2) D 多重排列 + 反向01背包 + 离线处理
https://codeforces.com/contest/1111/problem/D 多重排列 + 反向01背包 题意: 给你一个字符串(n<=1e5,n为偶数),有q个询问,每次询问两个 ...
- bootstrap 后台模板
http://wangye0119-html1.demo.smallseashell.com/index.html
- linux复制文件并修改文件名
#!/bin/bash #复制/casnw/backup/db203oradata/目录下的所有后缀名为dmp的文件拷贝到/casnw/backup/dbmonthbak 目录下cp -f /casn ...
- centos 下备份oracle数据
一.在xshell下root用户登录服务器 1.新建oracle数据库备份目录 mkdir -p /casnw/backup/oradata6910bak 2.设置目录权限为oinstall用户组的o ...