Bootstrap Web设计与开发实战
上QQ阅读APP看书,第一时间看更新

4.4 Bootstrap图片

本节我们简单介绍一下Bootstrap框架中关于图片样式的内容,Bootstrap框架定义了三种图片样式,分别为.img-rounded类、.img-circle类和.img-polaroid类,下面看一段代码示例。

【代码4-28】是一个应用图片样式的设计(详见源代码ch04目录中ch04.image.html文件):

        01  <div class="bs-docs-example bs-docs-example-images">
        02       <img data-src="../assets/js/holder/holder.js/90x90"
    class="img-rounded">
        03       <img data-src="../assets/js/holder/holder.js/90x90"
    class="img-circle">
        04       <img data-src="../assets/js/holder/holder.js/90x90"
    class="img-polaroid">
        05  </div>

其页面效果如图4.28所示。

图4.28 图片样式