Bootstrap
塞上江南果
如果你知道自己去哪,全世界都会为你让路
展开
-
Bootstrap+JavaScript实现广告轮播
之前写过一个原生纯js版本的广告轮播,相比之前那个,这个由于用了Bootstrap框架,实现起来代码相对简单一点,而且也比较美观,效果如图: 这是其中的两张图片,可以看到上面有小圆点,就和平时看到的一些网站的一样,点击圆点可以切换图片,按照指定的顺序,还有上面的箭头,点击左右箭头,就可以左右移动,这就是大体的功能。接下来上代码: HTML代码:<!-- 广告轮播 --><div id="ad-原创 2016-10-22 23:45:40 · 2134 阅读 · 0 评论 -
Bootstrap动态切换选项卡
最近在写一个系统的首页,就是平常的一个顶部导航栏,上面有登录和注册两个按钮,点击按钮弹出相应的登录或注册框,为了方便交互,把登录和注册在一个选项卡里放着,每次用户不用回到顶部去点击,只需要在当前框点击就可切换,先看一下样子吧,如图所示: 用Bootstrap平时在写静态页面时,只需要把.active类给自己想要第一个展现的框就可以,而动态的时候并不能简单的在js代码中给自己想要第一个展现的框直接设原创 2016-10-19 23:15:42 · 6281 阅读 · 0 评论 -
Bootstrap实现导航栏的两种方式
前言:导航是一个网站重要的元素组件之一,可以便于用户查找网站所提供的各项功能服务。导航的制作方法也是千奇百怪,五花八门。在下面的内容中,介绍两种制作导航栏的方式。一、用按钮组实现,代码如下:<div style="width:100%; background:#ff0"> <div class="btn-group"> <button class="btn btn-default" ty原创 2016-10-16 22:55:09 · 4874 阅读 · 2 评论 -
Bootstrap——表单
前言:由于表单的元素比较多,因此将Bootstrap的表单单独做个总结,表单作为Bootstrap的核心内容,主要功能是用来与用户做交流的一个网页控件,良好的表单设计能够让网页与用户更好的沟通。表单中常见的元素主要包括:文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。一、基础表单<form role="form"> <div class="form-group"> <labe原创 2016-10-15 22:00:23 · 551 阅读 · 0 评论 -
Bootstrap——表格、按钮、图像
前言: Bootstrap为表格、按钮、表单、图像等各种元素提供了不同的样式风格,我们在使用时,只要导入相应的css和js插件,以及引入相应的类名即可,下面介绍一些具体的标签一、表格 1、基础表格 <table class="table"> <thead> <tr> <th></th>原创 2016-10-14 22:05:41 · 2450 阅读 · 0 评论 -
Bootstrap——页面基本样式
1.Bootstrap简介 Bootstrap是简洁的,平面化的,移动端设备优先的,html/css框架,由三部分组成:css样式:可以去官网下载最新版本,或者直接引入链接http://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css“;js脚本:里面有一些js插件,和jQuery插件不一样,需要下载或直接引入链接htt原创 2016-10-13 23:08:48 · 1209 阅读 · 0 评论