欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Bootstrap縮略圖與警告框?qū)W習使用

 更新時間：2017年02月08日 15:22:14   作者：輕擾時光  
這篇文章主要為大家詳細介紹了Bootstrap縮略圖與警告框?qū)W習使用的相關(guān)資料，希望通過這篇文章和大家更多的去學習Bootstrap縮略圖與警告框，從中得到收獲

本文實例為大家分享了Bootstrap縮略圖與警告框的具體代碼，供大家參考，具體內(nèi)容如下

<html>
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Bootstrap</title>
 <link rel="stylesheet" href="css/bootstrap.css" rel="external nofollow" />
</head>
<body>
 <div class="container">
 <div class="row">
 <div class="col-lg-3"><!--thumbnail為縮略圖,外圍加了邊框并變?yōu)閳A角-->
 <a href="http://www.dbjr.com.cn" class="thumbnail">
  <img src="../logo.jpg"/>
 </a>
 </div>
 <div class="col-lg-3">
 <a href="http://www.dbjr.com.cn" class="thumbnail">
  <img src="../logo.jpg"/>
 </a>
 </div>
 <div class="col-lg-3">
 <a href="http://www.dbjr.com.cn" class="thumbnail">
  <img src="../logo.jpg"/>
 </a>
 </div>
 <div class="col-lg-3">
 <a href="http://www.dbjr.com.cn" class="thumbnail">
  <img src="../logo.jpg"/>
 </a>
 </div>
 </div>
 <div class="row">
 <div class="col-lg-4">
 <div class="thumbnail"><!--給父級加上thumbnail-->
  <a href="http://www.dbjr.com.cn">
  <img src="../logo.jpg"/>
  </a>
  <div class="caption"><!--可以增加圖片與文字之間的距離-->
  <h3>水果</h3>
  <p>蘋果梨橘子葡萄柚子香蕉蘋果梨橘子葡萄柚子香蕉</p>
  </div>
 </div>
 </div>
 </div>
 </div>
 <div class="container">
 <div class="row">
 <p class="alert alert-danger">這里是一個警告框?。?！<button class="close" data-dismiss="alert">&times;</button></p><!--data-dismiss="alert"使其與js進行交互-->
 </div>
 </div>
 <script src="js/jquery-2.1.0.js"></script>
 <script src="js/bootstrap.js"></script>
</body>
</html>

效果圖：

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

  • 前端防止用戶重復提交js實現(xiàn)代碼示例

    前端防止用戶重復提交js實現(xiàn)代碼示例

    這篇文章主要給大家介紹了關(guān)于前端防止用戶重復提交js實現(xiàn)的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起看看吧
    2018-09-09
  • 詳解Javascript中的原型OOP

    詳解Javascript中的原型OOP

    相信現(xiàn)在的很多程序員或多或少的都會寫JS，大部分也知道JS是基于原型的語言，但是如果問及JS原生對象（Object,Function,Array,Date等）的這個原型鏈長什么樣子？估計能回答出來的人就少了，所以這篇文章就給大家詳細介紹下，有需要的可以參考借鑒。
    2016-10-10
  • 在Javascript操作JSON對象，增加 刪除 修改的簡單實現(xiàn)

    在Javascript操作JSON對象，增加 刪除 修改的簡單實現(xiàn)

    下面小編就為大家?guī)硪黄贘avascript操作JSON對象，增加 刪除 修改的簡單實現(xiàn)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2016-06-06
  • laydate 顯示結(jié)束時間不小于開始時間的實例

    laydate 顯示結(jié)束時間不小于開始時間的實例

    下面小編就為大家?guī)硪黄猯aydate 顯示結(jié)束時間不小于開始時間的實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2017-08-08
  • 一文總結(jié)JavaScript中常見的設(shè)計模式

    一文總結(jié)JavaScript中常見的設(shè)計模式

    在程序設(shè)計中有很多實用的設(shè)計模式，而其中大部分語言的實現(xiàn)都是基于“類”。在程序設(shè)計中有很多實用的設(shè)計模式，而其中大部分語言的實現(xiàn)都是基于“類”。，本文將總結(jié)了JavaScript中常見的十五種設(shè)計模式，感興趣的朋友可以參考下
    2023-05-05
  • 微信小程序遍歷Echarts圖表實現(xiàn)多個餅圖

    微信小程序遍歷Echarts圖表實現(xiàn)多個餅圖

    這篇文章主要介紹了微信小程序遍歷Echarts圖表實現(xiàn)多個餅圖，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-04-04
  • JavaScript字符串轉(zhuǎn)數(shù)字的5種方法及遇到的坑

    JavaScript字符串轉(zhuǎn)數(shù)字的5種方法及遇到的坑

    JavaScript是一個神奇的語言，字符串轉(zhuǎn)數(shù)字有5種方法，各有各的坑法!接下來通過本文給大家介紹JavaScript字符串轉(zhuǎn)數(shù)字的5種方法及其陷阱，感興趣的朋友一起看看吧
    2018-07-07
  • 使用原生js實現(xiàn)頁面蒙灰(mask)效果示例代碼

    使用原生js實現(xiàn)頁面蒙灰(mask)效果示例代碼

    像js的框架Extjs的mask()和unmask()功能提供了蒙灰效果，當然jquery也提供了這種蒙灰方法，下面有個示例，大家可以參考下
    2014-06-06
  • 微信小程序中使用echarts的實現(xiàn)方法

    微信小程序中使用echarts的實現(xiàn)方法

    這篇文章主要介紹了微信小程序中使用echarts的實現(xiàn)方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-04-04
  • 一文詳解Proxy和Object.defineProperty的使用與區(qū)別

    一文詳解Proxy和Object.defineProperty的使用與區(qū)別

    在JavaScript中,對象是一種核心的數(shù)據(jù)結(jié)構(gòu),而對對象的操作也是開發(fā)中經(jīng)常遇到的任務,本文將深入比較Proxy和Object.defineProperty,感興趣的小伙伴可以了解下
    2023-12-12

最新評論