最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
Bootstrap缩略图与警告框学习使用
时间:2017-03-23 编辑:简简单单 来源:一聚教程网
代码如下 | 复制代码 |
< 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" >
< img src = "../logo.jpg" />
a >
div > < div class = "col-lg-3" > < img src = "../logo.jpg" />
a >
div > < div class = "col-lg-3" > < img src = "../logo.jpg" />
a >
div > < div class = "col-lg-3" > < img src = "../logo.jpg" />
a >
div >
div > < div class = "row" > < div class = "col-lg-4" > < div class = "thumbnail" >
< 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" >× button > p >
div >
div > < script src = "js/jquery-2.1.0.js" > script > < script src = "js/bootstrap.js" > script >
body >
html > |
效果图:
-
上一个: Bootstrap导航条学习使用(二)
-
下一个: Bootstrap路径导航与分页学习使用
相关文章
- Bootstrap缩略图的创建方法 07-15
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31
- html area标签解读 10-31
- html使用表单标签实现注册页面代码展示 10-31