Bootstrap缩略图与警告框学习使用

时间：2022-06-25 18:08:03 编辑：袖梨来源：一聚教程网

代码如下复制代码

<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>Bootstraptitle>

<link rel="stylesheet" href="css/bootstrap.css" rel="external nofollow" />

head>

<body>

<div class="container">

<div class="row">

<div class="col-lg-3">

<a href="http://www.jb51.net" class="thumbnail">

<img src="../logo.jpg"/>

a>

div>

<div class="col-lg-3">

<a href="http://www.jb51.net" class="thumbnail">

<img src="../logo.jpg"/>

a>

div>

<div class="col-lg-3">

<a href="http://www.jb51.net" class="thumbnail">

<img src="../logo.jpg"/>

a>

div>

<div class="col-lg-3">

<a href="http://www.jb51.net" class="thumbnail">

<img src="../logo.jpg"/>

a>

div>

<div class="row">

<div class="col-lg-4">

<div class="thumbnail">

<a href="http://www.jb51.net">

<img src="../logo.jpg"/>

a>

<div class="caption">

<h3>水果h3>

<p>苹果梨橘子葡萄柚子香蕉苹果梨橘子葡萄柚子香蕉p>

div>

<div class="container">

<div class="row">

<p class="alert alert-danger">这里是一个警告框！！！<button class="close" data-dismiss="alert">×button>p>

div>

<script src="js/jquery-2.1.0.js">script>

<script src="js/bootstrap.js">script>

body>

html>

效果图：

推荐专题

最新下载

热门教程

Bootstrap缩略图与警告框学习使用

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程