基于bootstrap实现bootstrap中文网巨幕效果


Posted in Javascript onMay 02, 2017

效果图:

基于bootstrap实现bootstrap中文网巨幕效果

实现代码:

<div class="jumbotron">
 <div class="container">
  <h1>Bootstrap案例开发</h1>
  <h2>简洁、直观、强悍的前端开发框架,让web开发更迅速、简单</h2>
  <p>
   <a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" class="btn btn-primary btn-lg btn-shadow v3a" title="bootstrap中文网巨幕效果" role="button" target="_blank">Bootstrap3中文文档(v3.3.7)</a>
  </p>
  <a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" class="v2a" rolw="button" target="_blank" title="Bootstrap2中文文档">Bootstrap2中文文档(v2.3.7)</a>
 </div>
</div>

添加自定义的CSS效果

<style>
 .jumbotron{style="background-color: rgba(88, 45, 88, 0.84);}
 .v2a{color: grey; -webkit-transition: all .3s ease-out;}
 .v2a:hover{color: white;text-decoration: underline;}
 .v3a{-webkit-transition: all .3s ease-out;}
 .v3a:hover{text-decoration: underline;}
</style>

以上所述是小编给大家介绍的基于bootstrap实现bootstrap中文网巨幕效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript的目的分析
Jan 05 Javascript
JavaScript中this关键字使用方法详解
Mar 08 Javascript
Jquery弹出窗口插件 LeanModal的使用方法
Mar 10 Javascript
javascript实现文本域写入字符时限定字数
Feb 12 Javascript
Egret引擎开发指南之视觉编程
Sep 03 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
JavaScript用构造函数如何获取变量的类型名
Dec 23 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
Jan 13 Javascript
Vue中使用Sortable的示例代码
Apr 07 Javascript
深入浅析var,let,const的异同点
Aug 07 Javascript
vue 解决数组赋值无法渲染在页面的问题
Oct 28 Javascript
微信小程序开发(三):返回上一级页面并刷新操作示例【页面栈】
Jun 01 Javascript
老生常谈js-react组件生命周期
May 02 #Javascript
js 用于检测类数组对象的函数方法
May 02 #Javascript
使用Bootstrap打造特色进度条效果
May 02 #Javascript
在百度搜索结果中去除掉一些网站的资料(通过js控制不让显示)
May 02 #Javascript
js实现字符全排列算法的简单方法
May 01 #Javascript
Vue2.x中的父组件传递数据至子组件的方法
May 01 #Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 #jQuery
You might like
给海燕B411配件机起死回生配上件
2021/03/02 无线电
让你同时上传 1000 个文件 (二)
2006/10/09 PHP
php设计模式 Builder(建造者模式)
2011/06/26 PHP
php过滤所有的空白字符(空格、全角空格、换行等)
2015/10/27 PHP
Yii实现复选框批量操作实例代码
2017/03/15 PHP
火狐浏览器(firefox)下获得Event对象以及keyCode
2008/11/13 Javascript
Node.js实战 建立简单的Web服务器
2012/03/08 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
2015/07/27 Javascript
JavaScript中this的9种应用场景及三种复合应用场景
2015/09/12 Javascript
js随机生成一个验证码
2017/06/01 Javascript
js获取元素的偏移量offset简单方法(必看)
2017/07/05 Javascript
vue 计时器组件的实现代码
2017/09/14 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
2018/04/26 Javascript
微信小程序自定义组件之可清除的input组件
2018/07/17 Javascript
JS中的算法与数据结构之栈(Stack)实例详解
2019/08/20 Javascript
Postman无法正常返回结果问题解决
2020/08/28 Javascript
[01:08]2014DOTA2展望TI 剑指西雅图LGD战队专访
2014/06/30 DOTA
Python中的rfind()方法使用详解
2015/05/19 Python
windows环境下tensorflow安装过程详解
2018/03/30 Python
python判断设备是否联网的方法
2018/06/29 Python
python 的 scapy库,实现网卡收发包的例子
2019/07/23 Python
python requests抓取one推送文字和图片代码实例
2019/11/04 Python
Python爬虫实例——爬取美团美食数据
2020/07/15 Python
Python classmethod装饰器原理及用法解析
2020/10/17 Python
CSS3支持IE6, 7, and 8的边框border属性
2012/12/28 HTML / CSS
浅谈基于HTML5的在线视频播放方案
2016/02/18 HTML / CSS
2014年五一促销活动方案
2014/03/09 职场文书
新年团拜会主持词
2014/04/02 职场文书
小学一年级评语大全
2014/04/22 职场文书
应届毕业生自荐书
2014/06/18 职场文书
大三学生学年自我鉴定
2014/09/12 职场文书
2014年外贸业务员工作总结
2014/12/11 职场文书
就业推荐表导师评语
2014/12/31 职场文书
党员志愿者服务倡议书
2015/04/29 职场文书
尼克胡哲观后感
2015/06/08 职场文书
java固定大小队列的几种实现方式详解
2021/07/15 Java/Android