为了账号安全,请及时绑定邮箱和手机立即绑定

玩转Bootstrap(基础)

  • 在Bootstrap框架中也为大家提供了近200个不同的icon图片,而这些图标都是使用CSS3的@font-face属性配合字体来实现的icon效果。 在Bootstrap框架中有一个fonts的目录,这个目录中提供的字体文件就是用于制作icon的字体文件。 自定义完字体之后,需要对icon设置一个默认样式,在Bootstrap框架中是通过给元素添加“glyphicon”类名来实现,然后通过伪元素“:before”的“content”属性调取对应的icon编码
    查看全部
    0 采集 收起 来源:图标(一)

    2018-03-22

  • 在Bootstrap框架中对于图像的样式风格提供以下几种风格: 1、img-responsive:响应式图片,主要针对于响应式设计 2、img-rounded:圆角图片 3、img-circle:圆形图片 4、img-thumbnail:缩略图片 使用方法非常简单,只需要在<img>标签上添加对应的类名
    查看全部
    0 采集 收起 来源:图像

    2018-03-22

  • 在Bootstrap框架中,要禁用按钮有两种实现方式: 方法1:在标签中添加disabled属性 方法2:在元素标签中添加类名“disabled”.区别在于:在元素标签中添加“disabled”属性的方法是可以禁止元素的默认行为,但是“.disabled”样式不会禁止按钮的默认行为。
    查看全部
  • 在Bootstrap框架中针对按钮的状态效果主要分为两种:活动状态和禁用状态。 Bootstrap按钮的活动状态主要包括按钮的悬浮状态(:hover),点击状态(:active)和焦点状态(:focus)几种。
    查看全部
  • 需要按钮宽度充满整个父容器(width:100%),特别是在移动端的制作中。那么前面的方法我们都无法很好的实现,除非重新定义按钮的宽度。其实在Bootstrap中并不需要这样做,Bootstrap框架中提供了一个类名“btn-block”。
    查看全部
    0 采集 收起 来源:块状按钮

    2018-03-22

  • btn-lg,btn-primary,btn-sm,btn-xs这几个类名可以配合按钮中其他颜色类名一起使用,但唯一一点不能缺少“.btn”类名
    查看全部
    0 采集 收起 来源:按钮大小

    2018-03-22

  • 使用方法,只需要在基础按钮“.btn”基础上追加对应的类名,就可以得到需要的按钮风格。
    查看全部
    0 采集 收起 来源:定制风格

    2018-03-22

  • 虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮。
    查看全部
    0 采集 收起 来源:多标签支持

    2018-03-22

  • 如果你不想为bootstrap.css增加自己的代码,而且设计又有这种样的需求,那么只能借助于Bootstrap的网格系统。 <span class="col-xs-6 help-block">你输入的信息是正确的</span>
    查看全部
    0 采集 收起 来源:表单提示信息

    2018-03-22

  • <small>标签制作副标题
    查看全部
    0 采集 收起 来源:标题(二)

    2018-03-22

  • striped是什么意思?有条纹的、有斑纹的 col-md-6是什么意思?网格相关的东西 thumbnail?布局小样 role含义是什么?怎样用? badge:胸卡、标志 toggle:切换元素的状态,显示\隐藏.
    查看全部
  • Bootstrap是一个简单,灵活的用于搭建优雅漂亮的web页面的HTML, CSS, JAVASCRIPT的工具集
    查看全部
    0 采集 收起 来源:Bootstrap简介

    2018-03-22

  • 标准的bootstrap模板
    查看全部
    0 采集 收起 来源:基本的HTML模板

    2018-03-22

  • Bootstrap框架中的考虑了不同浏览器的解析差异,进行了比较安全的兼容性处理,使按钮效果在不同的浏览器中所呈现的效果基本相同。
    查看全部
    0 采集 收起 来源:基本按钮

    2018-03-22

  • 很多时候,在表单验证的时候,不同的状态会提供不同的icon,比如成功是一个对号(√),错误是一个叉号(×)等。在Bootstrap框中也提供了这样的效果。如果你想让表单在对应的状态下显示icon出来,只需要在对应的状态下添加类名“has-feedback”。请注意,此类名要与“has-error”、“has-warning”和“has-success”在一起:
    查看全部

举报

0/150
提交
取消
课程须知
本教程适合具有一定前端基础的人员,对HTML和CSS有一定的了解,对于定制Bootstrap的同学需要具备LESS和Sass基础知识。
老师告诉你能学到什么?
1、了解Bootstrap框架 2、如何使用Bootstrap制作Web页面或Web应用程序 3、如何定制个性化Bootstrap

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!