编程 Javascript

Bootstrap基本样式学习笔记之图片(6)

Posted in Javascript onDecember 07, 2016

直接看Bootstrap图片基本样式例子：

<!DOCTYPE html>
<html lang="zh-cn">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link href="../../css/bootstrap.min.css" rel="stylesheet">
 <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
 <script src="../../js/bootstrap.min.js"></script>
 <title>图片</title>
</head>
<body>
<div class="container">
 <div class="page-header">
 <h1>照片样式</h1>
 </div>
 <div class="col-lg-3">
 <h3>原始照片</h3>
 <img src="../../img/girl.jpg">
 </div>
 <div class="col-lg-3">
 <h3>圆形效果</h3>
 <img src="../../img/girl.jpg" class="img-circle">
 </div>
 <div class="col-lg-3">
 <h3>圆角效果</h3>
 <img src="../../img/girl.jpg" class="img-rounded">
 </div>
 <div class="col-lg-3">
 <h3>边框效果</h3>
 <img src="../../img/girl.jpg" class="img-thumbnail">
 </div>
</div>
</body>
</html>

效果如下：

如果大家还想深入学习，可以点击这里进行学习，再为大家附3个精彩的专题：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持三水点靠木。

Bootstrap基本样式学习笔记之图片(6)

- Author -

kikay

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

禁止js文件缓存的代码

Apr 09 Javascript

五个jQuery图片画廊插件推荐

May 12 Javascript

jQuery中:last选择器用法实例

Dec 30 Javascript

JavaScript中实现依赖注入的思路分享

Jan 15 Javascript

简介JavaScript中的push()方法的使用

Jun 09 Javascript

浅析jQuery移动开发中内联按钮和分组按钮的编写

Dec 04 Javascript

微信小程序网络API发起请求详解

Nov 09 Javascript

BootStrap 标题设置跨行无效的解决方法

Oct 25 Javascript

mpvue微信小程序多列选择器用法之省份城市选择的实现

Mar 07 Javascript

node链接mongodb数据库的方法详解【阿里云服务器环境ubuntu】

Mar 07 Javascript

使用layer模态框给新页面传值的方法

Sep 27 Javascript

js实现烟花特效

Mar 02 Javascript

JavaScript学习笔记--常用的互动方法

Dec 07 #Javascript

详解JavaScript的内置对象

Dec 07 #Javascript

Bootstrap基本样式学习笔记之标签(5)

Dec 07 #Javascript

Bootstrap基本样式学习笔记之按钮(4)

Dec 07 #Javascript

jQuery中get方法用法分析

Dec 07 #Javascript

Bootstrap基本样式学习笔记之表单(3)

Dec 07 #Javascript

jQuery删除当前节点元素

Dec 07 #Javascript

You might like

解析array splice的移除数组中指定键的值,返回一个新的数组

2013/07/02 PHP

php分页函数示例代码分享

2014/02/24 PHP

基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据

2015/09/23 PHP

CI(Codeigniter)的Setting增强配置类实例

2016/01/06 PHP

JSON字符串传到后台PHP处理问题的解决方法

2016/06/05 PHP

js获取变量

2006/08/24 Javascript

jQuery库与其他JS库冲突的解决办法

2010/02/07 Javascript

js parentElement和offsetParent之间的区别

2010/03/23 Javascript

优化innerHTML操作(提高代码执行效率)

2011/08/20 Javascript

nodejs npm install全局安装和本地安装的区别

2014/06/05 NodeJs

理解javascript对象继承

2016/04/17 Javascript

JQuery在循环中绑定事件的问题详解

2016/06/02 Javascript

前端设计师们最常用的JS代码汇总

2016/09/25 Javascript

BootStrap 模态框实现刷新网页并关闭功能

2017/01/04 Javascript

js canvas实现擦除效果示例代码

2017/04/26 Javascript

jQuery Validate格式验证功能实例代码（包括重名验证）

2017/07/18 jQuery

微信小程序导入图标实现过程详解

2019/10/11 Javascript

Python中的面向对象编程详解(上)

2015/04/13 Python

深入理解python函数递归和生成器

2016/06/06 Python

Python生成短uuid的方法实例详解

2018/05/29 Python

Python3正则匹配re.split，re.finditer及re.findall函数用法详解

2018/06/11 Python

Python面向对象程序设计之继承与多继承用法分析

2018/07/13 Python

在Python中append以及extend返回None的例子

2019/07/20 Python

djano一对一、多对多、分页实例代码

2019/08/16 Python

使用tensorboard可视化loss和acc的实例

2020/01/21 Python

pycharm解决关闭flask后依旧可以访问服务的问题

2020/04/03 Python

Python与C/C++的相互调用案例

2021/03/04 Python

Footshop乌克兰：运动鞋的最大选择

2019/12/01 全球购物

机电工程专业应届生求职信

2013/10/03 职场文书

长辈证婚人证婚词

2014/01/09 职场文书

小露珠教学反思

2014/04/30 职场文书

国旗下讲话演讲稿

2014/05/08 职场文书

学校法制宣传月活动总结

2014/07/03 职场文书

初中信息技术教学计划

2015/01/22 职场文书

护理专业毕业自我鉴定

2019/08/12 职场文书

导游词之茶卡盐湖

2019/11/26 职场文书