好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

利用Bootstrap快速搭建个人响应式主页(附演示+源码)_html/css_WEB-ITnose

1.前言

我们每个程序员都渴望搭建自己的技术博客平台与他人进行交流分享,但使用别人的博客模板没有创意。做网站后台的开发人员可能了解前端,可是自己写一个不错的前端还是很费事的。幸好我们有Bootstrap,来自 Twitter,是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。我以后端程序员的角度讲一下前端设计(好别扭),网站的颜色搭配不那么理想。你可以自己改css样式,达到自己的目的。

下面是我自己用Bootstrap搭建的首页地址:共享gis:http://test.sharegis.cn/访问一下吧(手机电脑都试一下,体会一下响应式页面:-D,只做了首页)。

废话不多说,开始讲解:

2.实现

(1)基本模板搭建 参考Bootstrap中文网 http://v3.bootcss测试数据/getting-started/,起步—>基本模板

 1   2   3     4         5         6         7         8       9      10      Bootstrap 101 Template 11      12     13    14    15     

你好,世界!

16 17 18 19 20 21

(2)导航条 参考Bootstrap中文网 http://v3.bootcss测试数据/components/#navbar,组件—>导航条

 1   2   3     4         5         6         7         8       9      10      Bootstrap 101 Template 11      12     13    14    15     

你好,世界!

16 17 18 19 20 21

全景图片:

响应式图片:

(3)轮播 参考Bootstrap中文网 http://v3.bootcss测试数据/css/#grid Javascript插件—>Carousel

 1   2    

16 17

查看更多关于利用Bootstrap快速搭建个人响应式主页(附演示+源码)_html/css_WEB-ITnose的详细内容...

  阅读:47次