<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap图片</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<h2>图片</h2>

<p> .img-responsive类让图片支持响应式，将很好地扩展到父元素 (通过改变窗口大小查看效果):</p>
<img src="Images/HTML5LOGO.jpg" class="img-responsive" />

</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap图片支持响应式的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 图片：响应式图片

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. bootstrap 学习笔记（5）---- 图片和响应式工具

    (一)响应式图片: 在 Bootstrap 版本 3 中,通过为图片添加 .img-responsive 类可以让图片支持响应式布局.其实质是为图片设置了 max-width: 100%;. heig ...

  3. Bootstrap 实战之响应式个人博客 （一）

    一.示例 1.主页 2.博客详情页 3.在线地址 在线地址:入口 Addition:这里使用github-page将自己的静态项目免费部署到线上. 如果你只是做一些简单的静态项目做展示,付出这么大的时 ...

  4. Bootstrap<基础十> 响应式实用工具

    Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发.这些可以通过媒体查询结合大型.小型和中型设备,实现内容对设备的显示和隐藏. 需要谨慎使用这些工具,避免在同一个站点创建完全不同 ...

  5. IE浏览器支持响应式网站设计

    目前响应式网站设计比较流行, 下面是摘自百度百科有关响应式设计的定义. 响应式网站设计是一种网络页面设计布局,其理念是:集中创建页面的图片排版大小,可以智能地根据用户行为以及使用的设备环境进行相对应的 ...

  6. Bootstrap 实战之响应式个人博客 （二）

    阅读本博文前请参考:Bootstrap 实战之响应式个人博客 (一) 一.博客 1.结构 整体博客详情页的结构共包括四部分: 导航栏 博客主体内容 右侧栏:全局搜索框,广告位,推荐阅读 页尾 其中导航 ...

  7. bootstrap 自适应和响应式布局的区别

    自适应:  不管屏幕多大,都尽量不换行,而只是横向缩放. 响应式: 屏幕变小了之后,属于同一行的元素受到挤压后,行的右边元素自动换行显式: 屏幕大了后,本属于同一行的元素尽可能的排在同一行内: boo ...

  8. 使用Bootstrap 3开发响应式网站实践06,使用ListGroup、Thumbnails展示内容

    □ ListGroup展示内容 当希望把同类型的内容以列表.区块展示的时候,ListGroup是不错的选择. <div class="col-sm-6"> <h3 ...

  9. 使用Bootstrap 3开发响应式网站实践04,使用Panels展示内容

    在Bootstrap页面中,通常用Panels来展示主要功能的内容.该部分Html为: <div class="row" id="featureHeading&qu ...

随机推荐

  1. Codevs 1425 最长公共子串

    1425 最长公共子串  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 青铜 Bronze 题解       题目描述 Description 输入N(2<=N<= ...

  2. 计算机网络自顶向下方法第3章-传输层 (Transport Layer).1

    3.1 概述和运输层服务 运输层协议为运行在不同主机上的应用进程之间提供了逻辑通信(logic communication)功能. 3.1.1 运输层和网络层的关系 网络层提供了主机之间的逻辑通信,而 ...

  3. 慕课笔记-Java入门第二季

    1.java对象的使用 (1)创建对象 类名 对象名=new 类名(); (2)使用对象 引用对象的属性:对象名.属性; 引用对象的方法:对象名.方法(); Note: ①Java会给成员变量赋初始值 ...

  4. 【微服务】Dubbo初体验

    一.前言 之前微服务这块只用过SpringCloud搭建,但是最近面试会被问到dubbo框架,虽然之前也学了但是都忘了,故写此博客加深印象. 二.原理简介 Dubbo是一个分布式服务框架,以及阿里巴巴 ...

  5. Java基础 使用Properties类

  6. C - How Many Tables

    #include <cstdio> #include <cstdlib> #include <iostream> #include <algorithm> ...

  7. ES5数组的方法

    var ary = [1,23,4]; function isArray(o){ return Object.prototype.toString.call(o)=='[object Array]'; ...

  8. mysql 维护添加远程主机访问

    https://www.cnblogs.com/JNUX/p/6936548.html

  9. CentOS7下Oracle11gR2监听启动错误解决

    oracle监听程序启动失败,错误如下: [oracle@localhost ~]$ lsnrctl start LSNRCTL - Production on -APR- :: Copyright ...

  10. CF1062D Fun with Integers

    思路: 找规律. 实现: #include <bits/stdc++.h> using namespace std; typedef long long ll; int main() { ...