Bootstrap组件之页头、缩略图
.page-header——指定div元素包裹页头组件。
<div class="page-header">
<h1>小镇菇凉<small> 2小时前</small></h1>
</div>
.thumbnail——指定元素包裹缩略图组件
<div class="row">
<div class="col-xs-6 col-md-3">
<a href="#" class="thumbnail">
<img src="data:images/937654.jpg">
</a>
</div>
<div class="col-xs-6 col-md-3">
<div class="thumbnail">
<img src="data:images/937654.jpg">
<div class="caption">
<h4>第15届上海校花评比大赛</h4>
<p>这是上海复旦大学德语专业的大三学生,她的名字叫韩诗意。</p>
<p class="text-right">
<a href="#" class="btn btn-default">不喜欢</a>
<a href="#" class="btn btn-primary">喜欢</a>
</p>
</div>
</div>
</div>
</div>
Bootstrap组件之页头、缩略图的更多相关文章
- Bootstrap(9) 巨幕页头缩略图和警告框组件
一.巨幕组件巨幕组件主要是展示网站的关键性区域.//在固定的范围内,有圆角 <div class="container"> <div class="ju ...
- 第二百四十节,Bootstrap巨幕页头缩略图和警告框组件
Bootstrap巨幕页头缩略图和警告框组件 学习要点: 1.巨幕组件 2.页头组件 3.缩略图组件 4.警告框组件 本节课我们主要学习一下 Bootstrap 的四个组件功能:巨幕组件.页头组件.缩 ...
- Bootstrap 巨幕页头缩略图和警告框组件
一.巨幕组件 //在固定的范围内,有圆角 <div class="container"> <div class="jumbotron"> ...
- Bootstrap入门(十九)组件13:页头与缩略图
Bootstrap入门(十九)组件13:页头与缩略 1.页头 2.默认的缩略图 3.自定义缩略图 页头组件能够为 h1 标签增加适当的空间,并且与页面的其他部分形成一定的分隔.它支持 h1 标签内内嵌 ...
- Bootstrap提示信息(标签、徽章、巨幕和页头)
前面的话 在Bootstrap中,有一些组件用于提示信息,如 标签.徽章.巨幕和页头.本文将详细介绍Bootstrap提示信息 标签 在一些Web页面中常常会添加一个标签用来告诉用户一些额外的信息,比 ...
- Bootstrap页头
页头组件能够为 h1 标签增加适当的空间,并且与页面的其他部分形成一定的分隔.它支持 h1 标签内内嵌 small 元素的默认效果,还支持大部分其他组件(需要增加一些额外的样式). <div c ...
- Bootstrap之Bootstrap组件
一 文本居中 col-xx-offset-xx:水平居中 center-block:使用于不涉及float标签的水平居中,也不涉及列的居中,让哪里居中就写到哪里,本质是:margin:0 auto. ...
- 17、bootStrap组件
1.bootStrap组件 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 2.字体图标 ①不要和其他图标混合使用 ②只能对内容为空的元素起作用 3.下拉菜单 <di ...
- ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件
阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...
随机推荐
- 使用angularjs的$http.post异步提交数据时,服务器接收不了的问题
一,在正常情况下,使用表单的post方法提交数据,默认请求头的Content-Type:application/x-www-form-urlencoded类型, 提交数据格式如下: 二,使用angul ...
- 【MongoDB】The basic operation of Index in MongoDB
In the past four blogs, we attached importance to the index, including description and comparison wi ...
- Android 开发最佳实践
原文地址:https://github.com/futurice/android-best-practices/blob/master/translations/Chinese/README.cn.m ...
- Gradle:构建脚本概要
一.构建块 1.每一个构建块都包括三个基本构建块:project.task和property: 2.每一个构建块包括至少一个project,进而又包括一个或多个task: 3.project和task ...
- unity3d面试题摘选(全)
======================================= 数据结构和算法非常重要.图形学也非常重要! 大的游戏公司非常看重个人基础.综合能力.也有的看重你实际工作能力,看你的De ...
- php实现邮箱激活功能
php实现邮箱激活功能 一.样例 二.文件结构 其中swiftmailer-master是第三方插件,用来发验证邮件 三.核心代码 doAction.php 响应页面 <?php header( ...
- hdoj--1248--寒冰王座(完全背包)
寒冰王座 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submi ...
- Java-MyBatis:MyBatis3 | 日志
ylbtech-Java-MyBatis:MyBatis3 | 日志 1.返回顶部 1. 日志 Mybatis 的内置日志工厂提供日志功能,内置日志工厂将日志交给以下其中一种工具作代理: SLF4J ...
- [Tomcat]Tomcat6和Tomcat7的区别
Tomcat 7最大的改进是对Servlet 3.0和Java EE 6的支持.◆Tomcat 7完全支持Servlet 3.0规范◆Tomcat 7新增了对Java注释的支持◆Tomcat 7通过w ...
- oracle故障处理之删除大表空间hang住
背景 数据库分区表数据越来越大,需要对过期话的数据进行迁移,以及大的分区表需要进行数据的清理和删除,达到释放磁盘空间的目的. 问题说明 环境:linux 6.X 数据库:oracle 11.2.0.4 ...