内容 参数
  OS   Windows 10 x64
  browser   Firefox 65.0.2
  framework     Bootstrap 3.3.7
  editor   Visual Studio Code 1.32.1  
  typesetting   Markdown

code

<!DOCTYPE html>
<html lang="zh-CN"> <head>
<meta charset="UTF-8">
<!-- IE将使用最新的引擎渲染网页 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 页面的宽度与设备屏幕的宽度一致
初始缩放比例 1:1 -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <title>Demo</title>
<meta name="author" content="www.cnblogs.com/kemingli"> <!-- 引入外部bootstrap的css文件(压缩版),版本是3.3.7 -->
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"> <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询(media queries)功能 -->
<!-- 警告:通过 file:// 协议(就是直接将 html 页面拖拽到浏览器中)访问页面时 Respond.js 不起作用 -->
<!--[if lt IE 9]>
<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
<![endif]-->
</head> <body> <!-- start : demo -->
<div class="container" style="background-color:gray;">
<br />
<div class="thumbnail" style="height:100px;width:100px;"></div>
</div>
<!-- end : demo --> <!-- NO.1 加载框架依赖的jQuery文件(压缩版),版本是1.12.4 -->
<script src="bootstrap/js/jquery.min.js"></script>
<!-- NO.2 加载Bootstrap的所有JS插件,版本是3.3.7 -->
<script src="bootstrap/js/bootstrap.min.js"></script>
</body> </html>

result

resource

  • [ 文档 ] getbootstrap.com/docs/3.3
  • [ 源码 ] github.com/twbs/bootstrap
  • [ 源码 ] archive.mozilla.org/pub/firefox/releases/65.0/source/
  • [ 平台 ] www.cnblogs.com
  • [ 平台 ] github.com
  • [ 扩展 - 平台] www.bootcss.com
  • [ 扩展 - 浏览器 ] www.mozilla.org/zh-CN/firefox/developer


Bootstrap是前端开源框架,优秀,值得学习。

博文讲述的是V3版本,更为先进的是V4版本。学有余力的话,可作简单地了解。

Firefox是开源的浏览器,优秀,值得关注。

面对开源框架,分析、领悟与应用,能对其进行加减裁化,随心所欲而不逾矩。

博文的质量普通,仅供参考。盲目复制,处处是坑。Think twice before you act(三思而后行)!

Bootstrap3基础 thumbnail 圆角类型的div块的更多相关文章

  1. Bootstrap3基础 form-control 圆角的输入框,光标放入后边框变色

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  2. HTML+CSS基础 border css属性 Div块 盒子

    border  css属性 边框颜色 border-color:red/#ffffff/rgb()默认为黑色 边框样式 border-style:solid (实线) dashed (虚线).默认为n ...

  3. 【.Net基础一】 类型、对象、线程栈、托管堆运行时的相互关系

    目前在看CLR via C#,把总结的记下来,索性就把他写成一个系列吧. 1.[.Net基础一] 类型.对象.线程栈.托管堆运行时的相互关系 2.[.Net基础二]浅谈引用类型.值类型和装箱.拆箱 J ...

  4. Banner中利用Jquery隐藏显示下方DIV块

    实现方式1: <!DOCTYPE html><html><head>    <meta charset="UTF-8">    &l ...

  5. PHP控制div块大小和颜色的例子

    网站为了设计的更好看,会有很多的样式,而用php来控制样式很常见,无聊写了一个可以用于列表展示的样式,不喜忽喷. 1.先添加一个style样式控制div默认不换行 <style>div{f ...

  6. JavaScript学习笔记-基础语法、类型、变量

    基础语法.类型.变量   非数字值的判断方法:(因为Infinity和NaN他们不等于任何值,包括自身) 1.用x != x ,当x为NaN时才返回true; 2.用isNaN(x) ,当x为NaN或 ...

  7. 采用CSS3的动态元素(动画)设计div块的层级式展现

    此练习作品是为学习HTML5+CSS3而设计的(如有不好请大家批评指教~~~). 操作:当页面加载时,点击网页中的绿色块(一层),则有其他几块(二层)从其中央出现并向外延伸并旋转,点击这几块中任意一个 ...

  8. 使用 margin 让div块内容居中

    问:有一个div块,其width为300px,如何设置margin让div块居中显示? 答:margin设置为 margin:0 auto,即div块的上下外边距设置为 0 , 左右外边距设置为 自动 ...

  9. css实现div块半透明

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. zhenya moves from parents

    Zhenya moved from his parents' home to study in other city. He didn't take any cash with him, he onl ...

  2. ubuntu的apt-get install的默认安装路径(转)

    一.apt-get 安装 deb是debian linus的安装格式,跟red hat的rpm非常相似,最基本的安装命令是:dpkg -i file.deb或者直接双击此文件 dpkg 是Debian ...

  3. day20:序列化模块,模块的导入

    1,什么是序列化--将原本的字典,列表等内容转换成一个字符串的过程就叫做序列化,字符串是有顺序的,序列化转向一个字符串的过程,我们平时说的序列,指的就是字符串. 2,为何要序列化?本来字符串是可以强转 ...

  4. C# 让String.Contains忽略大小写

    在C#里,String.Contains是大小写敏感的,所以如果要在C#里用String.Contains来判断一个string里是否包含一个某个关键字keyword,需要把这个string和这个ke ...

  5. python练习题-day14

    一.选择题 1. python不支持的数据类型有:A. charB. intC. floatD. list ans:A 2.x = ‘foo’y = 2print(x + y) A. fooB. fo ...

  6. @Value("${xxxx}")注解的配置及使用

    代码中的用法 Spring 通过@Value注解获取*.porperties文件code的内容,然后赋值给使用该注解的Code属性上. @Value("${code}") priv ...

  7. iOS学习之Object-C语言属性和点语法(转载收集)

    一.属性      1.属性的声明:在.h文件中使用@property声明属性.           @property NSString *name;       2.属性的作用是生成setter以 ...

  8. bugfree3.0.1-BUG解决方案修改

    该篇内容来自文档“masterBugFree2.pdf”,记录在这里. 1.如何将解决方案改为中文 在\Bugfree\Lang\ZH_CN_UTF-8 \_COMMON.php 文件中做如下修改/* ...

  9. Servlet 随记:

    API 1)init(ServletConfig config) 何时执行:servlet对象创建的时候执行 ServletConfig : 代表的是该servlet对象的配置信息 2)service ...

  10. java之数据库连接池-dbcp&c3p0&dbutils

    介绍 因为数据库连接对象的创建比较消耗性能,所以可以在应用程序启动时就在内存中开辟一片空间(集合)存放多个数据库连接对象,后面需要连接时直接从该空间中取而不用新创建:使用完毕后归还连接(将连接重新放回 ...