#TRAP

Bootstrap图标

  小图标icon是一个优秀Web中不可缺少的一部分,起到画龙点睛的效果。在Bootstrap框架中也为大家提供了250多个不同的icon图片。本文将详细介绍Bootstrap图标 原理分析  Bootstrap框架中的图标都是字体图标,其实现原理就是通过@font-face属性加载了字体@font-face...
代码星球 代码星球·2020-05-24

Bootstrap图像

  图像在网页制作中也是常要用到的元素,本文将详细介绍Bootstrap图像 响应式图片  通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width:100%;、 height:auto; 和&nbs...
代码星球 代码星球·2020-05-24

Bootstrap概述

  Bootstrap是简单、灵活的用于搭建WEB页面的HTML、CSS、Javascript的工具集。Bootstrap基于HTML5和CSS3,具有漂亮的设计、友好的学习曲线、卓越的兼容性,还有12列响应式栅格结构,丰富的组件等等。按照官网的宣传来说,Bootstrap是最受欢迎的HTML、CSS和JS框架,用于开...
代码星球 代码星球·2020-05-24

Bootstrap表格

  表格是Bootstrap的一个基础组件之一,Bootstrap为表格提供了1种基础样式和4种附加样式以及1个支持响应式的表格。在使用Bootstrap的表格过程中,只需要添加对应的类名就可以得到不同的表格风格,本文将详细介绍Boostrap表格 基本实例  Boostrap将表格<table>...
代码星球 代码星球·2020-05-24

Bootstrap排版——HTML元素的样式重定义

  Bootstrap对默认的HTML元素进行了CSS样式定义,使得各种基本结构套用出来的HTML页面更加美观。本文将详细介绍Bootstrap中排版相关的内容 标题【h】  HTML中的所有标题标签,<h1> 到 <h6> 均可使用  默认情况下,从h1...

Bootstrap自动定位浮标

  Affix插件主要功能就是通过插件给某个元素(需要固定的元素)添加或删除position:fixed,实现元素在浏览器窗口的粘性固定效果。本文将详细介绍Bootstrap自动定位浮标 基本用法  首先,来看一个苹果官网对自动定位浮标的应用  从上面的git图中可知,Macbook一栏滚动到一定高度时,固定...

Bootstrap图片轮播

  图片轮播效果在Web中常常能看到,很多人也称之为幻灯片。其主要显示的效果就是多幅图片轮流播放。鼠标悬停在图片时会暂停播放,如果鼠标悬停或单击右下角圆点时,会显示对应的图片。这种图片轮播效果,在Bootstrap框架中是通过Carousel插件来实现的。本文将详细介绍Bootstrap图片轮播 结构  一个...
代码星球 代码星球·2020-05-24

Bootstrap手风琴效果

  Bootstrap框架中Collapse插件(折叠)其实就是我们常见的手风琴效果。当单击一个触发元素时,在另外一个可折叠区域进行显示或隐藏,再次单击时可以反转显示状态。经典的场景是多个折叠区域的手风琴风格以及单一title/content的风格,本文将详细介绍Bootstrap手风琴效果 结构  手风琴最...
代码星球 代码星球·2020-05-24

Bootstrap按钮插件

  按钮插件提供了一组可以控制按钮多种状态的功能,比如按钮的禁用状态、正在加载状态、正常状态等。本文将详细介绍Bootstrap按钮插件 加载状态  通过按钮可以设计状态提示,当单击按钮时,会显示loading状态信息。例如,点击“加载”按钮,会触发按钮的加载的状态  通过添加&nbs...
代码星球 代码星球·2020-05-24

Bootstrap弹出框

  表面上看,弹出框其实就是一种特殊的提示框,只是多了一个标题而已。但实际上,还是有不同之处的。本文将详细介绍Bootstrap弹出框 基本用法  在制作提示框(tooltip)时,可以使用<button>或者<a>标签元素,而且通过data-属性来声明提示框的信息。而弹出框popov...
代码星球 代码星球·2020-05-24

Bootstrap选项卡

  选项卡Tabs是Web中一种非常常用的功能。用户点击对菜单项,能切换出对应的内容。本文将详细介绍Bootstrap选项卡基本用法  Bootstrap框架中的选项卡主要有两部分内容组成:  1、选项卡菜单组件,对应的是Bootstrap的 nav-tabs  2、可以切换的选项卡面板组件,在Bootstr...
代码星球 代码星球·2020-05-24

Bootstrap滚动监控器

  滚动监听插件是用来根据滚动条所处的位置来自动更新导航项的。滚动导航条下面的区域并关注导航项的变化,下拉菜单中的条目也会自动高亮显示。本文将详细介绍Bootstrap滚动监控器 基本用法  滚动监听插件是根据滚动的位置自动更新导航条中相应的导航项的,该插件可自动检测到达哪个位置了,然后在需要高亮的菜单父元素...
代码星球 代码星球·2020-05-24

Bootstrap模态弹出框

  在Bootstrap框架中把模态弹出框统一称为Modal。这种弹出框效果在大多数Web网站的交互中都可见。比如点击一个按钮弹出一个框,弹出的框可能是一段文件描述,也可能带有按钮操作,也有可能弹出的是一张图片。本文将详细介绍Bootstrap模态弹出框 结构分析  Bootstrap框架中的模态弹出框,分别...
代码星球 代码星球·2020-05-24

Bootstrap插件概述

  Bootstrap除了包含丰富的Web组件之外,如下拉菜单、按钮组、导航、分页等,还包括一些JavaScript的插件。插件为Bootstrap的组件赋予了“生命”。Bootstrap的JavaScript插件可以单独导入到页面中,也可以一次性导入到页面中。因为在Bootstrap中的Jav...
代码星球 代码星球·2020-05-24

Bootstrap列表组

  列表组是Bootstrap框架新增的一个组件,可以用来制作列表清单、垂直导航等效果,也可以配合其他的组件制作出更漂亮的组件。本文将详细介绍Bootstrap列表组 基础列表组  基础列表组,看上去就是去掉了列表符号的列表项,并且配上一些特定的样式。在Bootstrap框架中的基础列表组主要包括两个部分:&...
代码星球 代码星球·2020-05-24
首页上一页...1516171819...下一页尾页