基于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 相关文章推荐
JS类库Bindows1.3中的内存释放方式分析
Mar 08 Javascript
ExtJS4 Grid改变单元格背景颜色及Column render学习
Feb 06 Javascript
js 立即调用的函数表达式如何写
Jan 12 Javascript
js如何判断用户是否是用微信浏览器
Jun 05 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
Sep 17 Javascript
实例分析浏览器中“JavaScript解析器”的工作原理
Dec 12 Javascript
three.js绘制地球、飞机与轨迹的效果示例
Feb 28 Javascript
Vue实现动态响应数据变化
Apr 28 Javascript
详谈js对url进行编码和解码(三种方式的区别)
Aug 16 Javascript
js中innerText/textContent和innerHTML与target和currentTarget的区别
Jan 21 Javascript
Vue 实现手动刷新组件的方法
Feb 19 Javascript
vue中实现弹出层动画效果的示例代码
Sep 25 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
PHP EOT定界符的使用详解
2008/09/30 PHP
如何用php获取程序执行的时间
2013/06/09 PHP
php实现mysql封装类示例
2014/05/07 PHP
PHP中使用file_get_contents抓取网页中文乱码问题解决方法
2014/12/17 PHP
Laravel框架实现redis集群的方法分析
2017/09/14 PHP
详解phpstorm2020最新破解方法
2020/09/17 PHP
让焦点自动跳转
2006/07/01 Javascript
javascript实现unicode和字符的互相转换
2007/07/18 Javascript
js对图片base64编码字符串进行解码并输出图像示例
2014/03/17 Javascript
node.js中的fs.fsyncSync方法使用说明
2014/12/15 Javascript
javascript日期比较方法实例分析
2016/06/17 Javascript
JavaScript 节流函数 Throttle 详解
2016/07/04 Javascript
JS实现HTML表格排序功能
2016/08/05 Javascript
js手机号4位显示空格,银行卡每4位显示空格效果
2017/03/23 Javascript
jQuery实现购物车的总价计算和总价传值功能
2018/11/28 jQuery
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
vue 获取视频时长的实例代码
2019/08/20 Javascript
javascript 构建模块化开发过程解析
2019/09/11 Javascript
小程序中手机号识别的示例
2020/12/14 Javascript
Python图像灰度变换及图像数组操作
2016/01/27 Python
python2 与python3的print区别小结
2018/01/16 Python
解决python中画图时x,y轴名称出现中文乱码的问题
2019/01/29 Python
Python3环境安装Scrapy爬虫框架过程及常见错误
2019/07/12 Python
在Python中字符串、列表、元组、字典之间的相互转换
2019/11/15 Python
解决pycharm每次打开项目都需要配置解释器和安装库问题
2020/02/26 Python
PyCharm配置anaconda环境的步骤详解
2020/07/31 Python
用html5的canvas和JavaScript创建一个绘图程序的简单实例
2016/07/06 HTML / CSS
canvas绘制太极图的实现示例
2020/04/29 HTML / CSS
联谊活动策划书
2014/01/26 职场文书
主办会计岗位职责
2014/03/13 职场文书
县政府办公室领导班子个人对照检查材料
2014/09/16 职场文书
公务员党的群众路线教育实践活动学习心得体会
2014/10/30 职场文书
公司员工违纪检讨书
2015/05/05 职场文书
呐喊读书笔记
2015/06/30 职场文书
导游词之沈阳清昭陵
2019/12/28 职场文书
python3读取文件指定行的三种方法
2021/05/24 Python