Bootstrap按钮样式,图片样式

原创 2018年04月15日 19:33:04

按钮样式

.btn                 表示按钮,它是所有按钮的父类名

.btn-default      默认样式的按钮

.btn-primary     重要的按钮

.btn-success     成功的按钮

.btn-danger      危险的按钮

.btn-warning    警告的按钮

.btn-info           一般的信息按钮

.btn-link           链接状态的按钮

.btn-bg            超大按钮

.btn-sm            小按钮

.btn-xs              超小按钮

.btn-block        块状按钮,一个按钮大小独占一行

给链接添加按钮样式的话,链接也会编程按钮的样子

<a href="http://baidu.com/" class="btn btn-primary">我是百度</a>

 

图片样式

响应式的图片

.img-responive  图片会跟随屏幕的大小而等比例的放大和缩小。

.img-rounded    圆角矩形图片

.img-circle         圆形图片

.img-thumbnail  圆角边框的图片

版权声明: https://blog.csdn.net/dfggffdd/article/details/79951702

bootstrap——css样式(五、按钮和图片)

1、预定义样式的按钮 bootstrap为我们设计了一些按钮样式Default Primary
  • zaichuanguanshui
  • zaichuanguanshui
  • 2017-01-18 15:57:22
  • 1501

Bootstrap之表格,按钮,表单和图片的样式

Bootstrap之表格,按钮,表单和图片的样式本文中,都是结合本人的学习Bootstrap时所做的练习,来理解通过内置的 CSS 定义,Bootstrap的表格,按钮,表单和图片是如何来显示各种丰富...
  • ganyingxie123456
  • ganyingxie123456
  • 2017-05-06 23:11:13
  • 2547

Bootstrap全局CSS样式之按钮和图片

.btn-default——按钮的默认样式; .btn-primary——按钮的首选样式; .btn-success——按钮的成功样式; .btn-info——按钮的一般信息样式;‘ .btn-war...
  • bboyjoe
  • bboyjoe
  • 2015-07-26 22:09:34
  • 2040

Bootstrap—各式各样的按钮

Bootstrap为我们提供了各式各样漂亮的按钮,我们无需自己给按钮写样式,直接使用它给我们提供的类样式,使用在我们的按钮上,非常的简单方便。 活学活用,自己利用bootstrap的样式来做一个表格...
  • nongweiyilady
  • nongweiyilady
  • 2016-12-13 00:00:29
  • 11852

Bootstrap框架---CSS全局样式之按钮样式

预定义样式 首先,我们先要链接css样式和JQ文件 使用下面列出的类可以快速创建一个带有预定义样式的按钮。 Default Primary Success ...
  • xiaowu_hhb
  • xiaowu_hhb
  • 2016-12-02 14:50:59
  • 2907

Bootstrap 教程第六课:各种按钮组合样式

Bootstrap给按钮提供了很丰富的样式,以及组合,根据不同的需求,可以灵活定制自己想要得到的样式。在第四课中,我们介绍了一组按钮添加.btn-group类,使一组按钮组合起来成为一个小的功能按钮集...
  • kl28978113
  • kl28978113
  • 2016-06-20 17:02:04
  • 2650

Bootstrap图片样式使用方法

在Bootstrap中自带了几种图片样式,能够让你很快地对其进行使用,这几种样式使用起来相当简单,让我们一起来看看怎么快速调用Bootstrap图片样式。   Bootstrap图片圆角样...
  • u012238748
  • u012238748
  • 2017-01-16 14:30:17
  • 2010

buttons.css——可以与bootstrap融合的按钮样式库

前言 Buttons 是一个高度可定制的、免费并且开源的按钮 CSS 样式库。 .button是基本样式 一、基本样式 》形状:长方、圆角长方、正方 、圆角正方 、圆(默认,button-rounde...
  • wangjiaohome
  • wangjiaohome
  • 2015-11-10 16:09:43
  • 2321

bootstrap中按钮的使用样式

如下图
  • u011144681
  • u011144681
  • 2014-05-10 15:57:44
  • 3577

bootstrap中 几个漂亮的按钮样式

此博文是在菜鸟教程上看到的。 对于初学者很是有帮助,所以把这篇博文放上来,供大家参考。 源课程: http://www.runoob.com/try/try.php?filename=boots...
  • u012947276
  • u012947276
  • 2018-01-22 10:22:11
  • 271
收藏助手
不良信息举报
您举报文章:Bootstrap按钮样式,图片样式
举报原因:
原因补充:

(最多只允许输入30个字)