Rails 请教一下 Rails 的页面布局,针对针对 Agile Web Development with Rails,4rd Edition

crabby · 2012年05月16日 · 最后由 nuanshuidai 回复于 2013年05月29日 · 5005 次阅读

目前我进展到 Ajax 这一章节了,当下的任务是迁移购物车 将购物车迁移到左边的边框,理想的效果图应该如下图所示:

不过目前我的购物车,还比较丑陋 ,没有出现理想的界面,我的界面如下,现在的问题主要在页面布局上,撇开 Ajax,求助一下布局文件以及相关的实现吧。

我的界面为何如此丑陋??目前我没有找到解决方法,也没有定位到具体的原因,只能说下我淫想的猜测(没用过 Gimp,非常不习惯)下图中的 side 元素,占据了太多的位置,理想的位置是在左侧边栏;main 应该在屏幕的中右方 . 按照书中的做法,通篇的布局文件是在 depot.css 中定义的;而 Rails32 版中,对应的 app/views/layouts/application.html.erb 文件中有如下的代码,

<%= stylesheet_link_tag "application" %><!-- --> <%= javascript_include_tag "application" %><!-- --> <%= csrf_meta_tag %><!-- --> stylesheet_link_tag 是指向 “application” 的,在 Rails3.0 中的相关代码 stylesheet_link_tag 参数是 “depot",即书中一直以来操作的 depot.css 布局文件。depot.css 文件所在的目录为 public/stylesheets/depot.css,side 和 main 在其中已经定义了.书中的源码是 http://media.pragprog.com/titles/rails4/code/rails30/depot_f/public/stylesheets/depot.css 为了验证,我对里面的 side 和 main 元素进行了相应参数的调整,但是在我的浏览器中并没有相应的变动.

关于这个疑问,我还没有弄明白里面到底是怎么实现的。 打开首页,rake routes 展示的结果是指向 store#index,浏览器应该会打开 store 目录下面的 index.html.erb 文件,但是实际上好像打开的是与 store 同级目录 layouts 中的 application.html.erb 文件,这是为什么,在书中的哪个章节有详细的介绍呢?在打开 application.html.erb 这个文件,里面的代码中有关键性的两句代码,Rails3.2 版中的代码应该是如下的样子,stylesheet_link_tag 中明明写的是 application,实际上好像生效的是 public/stylesheets/depot.css 这个样式代码呢? <%= stylesheet_link_tag "application" %><!-- --> <%= javascript_include_tag "application" %><!-- -->

希望早点儿弄明白我的购物车侧边栏啊 ,T_T

标题有一个错字 4th, 另外你的页面看起来像是 CSS 完全没加载,还有文章的中英文还是留白吧,看起来好痛苦。。。

看起来是 css 完全没加载,先检查这方面

#2 楼 @Juanito 好的,我中英文之后会注意留白,想起你之前说的 Ruby on Rails Tutorial by Michael Hartl 这教程是不是收费的?

如果你使用的版本跟树上的版本不是一样的 在新的 rails 的版本里面 css 加载的不是书中提到的 public 文件夹下的 stylesheet 而在 app/assets 文件夹下面了

#5 楼 @Shadow 太给力了,是这个原因

我用的是 Rails3.2 版本,我将源码中 app/assets/stylesheets 目录中的文件拷贝过来为我所用就好了 不过有个小问题,直接拷贝进来的话,提示如下错误 Showing /home/Crabby/depot/app/views/layouts/application.html.erb where line #8 raised: /home/Crabby/depot/app/assets/stylesheets/application.css has already been required

我笨拙的将我目录下对应的 application.css 文件弄个别名 application.css_bak 就一点错误都木有了,哈哈,有些小鸡动呀 .

#2 楼 @Juanito #3 楼 @Rei 也谢谢两位,还是版本的问题,@Shadow 说到点子上了

建议退回书上的版本练习,3.1 开始新增的 assets pipeline 对应以前的书可能会产生各种问题。

已经有朋友将 Rails Guide 的 Asset Pipeline 这篇文章翻成中文,可以参考下。

#8 楼 @Rei 额,是存在这样的问题呀,先这么走着,要是我实在进展不下去了,我再回退

rails 的更新是很快的,如果你有其他语言的经验,建议还是直接看官方文档学起,我就是这么过来的。

我也遇到楼主一样的问题,在社区中看到了是应该在 assets 目录下的~

#12 楼 @bigpig85 #11 楼 @enix12enix 这问题已解决了,是版本的差异。好在我已经弄到 Rails3.2 对应的敏捷开发书了,需要的吱一声哈.

额,我是 rails 新手,跟着第四版的书走有好多不能实现。经常出问题,还请楼主贡献秘笈啊!谢谢了!邮箱 jackzones1991@gmails.com

#13 楼 @Crabby Rails3.2 对应的敏捷开发书 有这个版本吗?likeyu@gmail.com

#14 楼 @jackzones #15 楼 @dreamrise @ericguohttp://ruby-china.org/topics/1626 这个帖子的 14 楼已经回复,真的非常感激@ericguo ,书籍我已发送,请注意查收(包括垃圾邮件箱 )

感谢@Crabby@ericguo,已经下载了~

关于 CSS 没加载, 如果你使用的是 Rails3.2,那么就要把.css 文件放到/app/assets/stylesheets 下

#13 楼 @Crabby 经典的书啊,给我也发一份,给小朋友们用。谢谢楼主!nuanshuidai@126.com

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册