rails 静态网页 续 博客分类: ruby
上一篇的网页 虽然体现了基本的功能 但是它还不能算是一个网页,下面我们继续来做,看视频学习虽然好但是特点就是有的东西当时记住了但是过一段时间会忘记,在这里记下笔记以便于以后的使用把。 下面就在网页的主页中添加一个图片:
<body>
+ <img src="images/home-banner-bg.jpg" alt="home-banner"> </body>
但是呢 这样子页面在缩进以后会变得很难看,下面解决这个问题
创建一个插件库 专门的放置这些我们用到的插件public/js/目录
wget https://raw.githubusercontent.com/danmillar/jquery-anystretch/master/jquery.anystretch.min.js
在index中添加
<link rel="stylesheet" href="css/common.css"> + <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>+ <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>+ <script src="js/jquery.anystretch.min.js"></script> </head>
在body上方添加
<script> $('.home-banner').anystretch(); </script>
然后index.css中设置以下div的高度
.home-banner { height: 600px; }
这样大的背景图就设置好了
拷贝index.html的文件过来然后body部分修改一下
<h1>about</h1>
<body>
标签,改为 <body class="index">
这样让这个 header 变成透明色。
.index .navbar { background: transparent; }
而 about 页面的 navbar 依然是黑的。
好了这样子 一个静态页面基本算是初步的完成了,样式可以留下自己研究修改 颜色以及宽度边框等,看自己的喜好了,以后还会记录自己在ralis 的路上所遇到的问题,和好的解决方案,记录自己的点滴,再次感谢peter 的视频教学,对于新手而言是非常的不错,简单易懂,循序渐进。
推荐阅读
-
rails 如何将excel文件导入数据库 博客分类: ruby ruby
-
rails断点调试 博客分类: ruby
-
ruby-日记 博客分类: ruby ruby注册新手rails
-
rails 静态网页 续 博客分类: ruby
-
Rails routes mapping的一个奇怪的问题。顺便讨论一下如何做RESTful的paginate。 博客分类: Ruby RoR RailsRubyRESTFlashCache
-
Rails中使用REST,登录相关的问题,如何获得当前正在处理的url? 博客分类: Ruby RoR RailsRESTRubyMVCBlog
-
不错的 rails 插件站点 博客分类: Ruby/Rails Rails
-
RSpec笔记 - let 和 let! 博客分类: 测试Ruby on Rails RSpecRuby on Rails
-
Ruby on rails 创建基于Rspec项目 博客分类: ROR rspecrailsruby
-
Rails里给文件上传添加progress_bar 博客分类: Ruby RailsUIF#HTML