ruby-on-rails - Rails 表单与 HTML/CSS 模板联姻

标签 ruby-on-rails css

我已经购买了用于 Rails 应用程序的 HTML/CSS 模板。通过将模板代码作为布局放置,然后使用 <%= yield %> 将 Rails 内容放入模板,我让 Rails 应用程序与模板配合得很好。一切正常,包括 CSS 样式。

一条皱纹....

我似乎无法让登录屏幕正常工作。问题似乎在于替换模板处理表单的方式(HTML 和 CSS 问题)以及 Rails 希望传递表单的方式。

这是模板表单区域:

<body id="login">
    <header>
        <div id="logo">
            <a href="login.html">whitelabel</a>
        </div>
    </header>
    <section id="content">
    <form action="submit.php" id="loginform">
        <fieldset>
            <section><label for="username">Username</label>
                <div><input type="text" id="username" name="username" autofocus></div>
            </section>
            <section><label for="password">Password <a href="#">lost password?</a></label>
                <div><input type="password" id="password" name="password"></div>
                <div><input type="checkbox" id="remember" name="remember"><label for="remember" class="checkbox">remember me</label></div>
            </section>
            <section>
                <div><button class="fr submit">Login</button></div>
            </section>
        </fieldset>
    </form>
    </section>
    <footer>Copyright by revaxarts.com 2011</footer>

这是标准的 Rails 登录表单代码(使用 Devise View )

    <h2>Sign in</h2>

    <%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %>
     <p><%= f.label :emailer %><br />
     <%= f.text_field :email %></p>

    <p><%= f.label :password %><br />
    <%= f.password_field :password %></p>

    <p><%= f.submit "Sign in" %></p>
    <% end %>

    <%= render :partial => "devise/shared/links" %>

我似乎无法弄清楚如何将 CSS 指令引入现有的 Rails form_for 部分。我尝试了很多不同的组合,但没有任何效果。

最后,除了 CSS 样式之外,表单将提交并让我进入应用程序,所以我知道后端 Devise 连接正在工作。它只是不会采用 CSS 样式。

此外,我可以从模板登录屏幕剪切粘贴整个代码,登录字段加载正确的 CSS 样式,所以我知道该部分指向正确的 CSS 和 JS 文件,并且他们在场并正在工作。

有什么想法吗?

谢谢!

最佳答案

您只需将 CSS id 和 class 参数添加到 View :

<%= form_for ..., :class => 'someclass', :id => 'someid' %>

http://guides.rubyonrails.org/form_helpers.html

关于ruby-on-rails - Rails 表单与 HTML/CSS 模板联姻,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7661669/

相关文章:

ruby-on-rails - 升级到 Rails 7 后 Active Record 类型映射查询的性能问题

html - 关于 Bootstrap 4 - Navbar 顶部放置

html - 去除页面顶部的边框

html - 重写 Bootstrap 并在图像上使用转换

ruby-on-rails - Amazon SES 中的拉丁字符

ruby-on-rails - 加载应用程序时出现奇怪的 rails 错误

ruby-on-rails - Sidekiq 是否会自动向 Rollbar 报告错误?

ruby-on-rails - 删除 SimpleForm 生成的选择字段的空白选项

javascript - IOS Safari : clipping of iframe when using transform3d

html - 元素在它后面的绝对元素时丢失悬停