質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

Q&A

解決済

1回答

2332閲覧

railsでbootstarpのテンプレートのやり方

hayabusakk

総合スコア16

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

0グッド

1クリップ

投稿2017/03/30 13:23

railsでdeviseでサインイン,ログイン昨日を作りました。gem bootstarpを入れて、サインアウトのレイアウトをきれいにしようと思ったですが、bootstarpのテンプレートをどのようにして、railsのhtml.erbに入れたいいのかわからないです。
形式が違うので、できないです。

http://bootsnipp.com/snippets/featured/register-page
上のURLは、bootstarpのテンプレートです。

コード 現在のコード <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3 text-center"> <h2>登録</h2> <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %> <%= devise_error_messages! %> <div class="field"> <%= f.label :username %><br /> <%= f.text_field :username, :placeholder => '北尾 恵太' %> </div> <div class="field"> <%= f.label :email %><br /> <%= f.email_field :email, :placeholder => 'email', autofocus: true %> </div> <div class="field"> <%= f.label :password %> <% if @minimum_password_length %> <em>(<%= @minimum_password_length %>)文字以上</em> <% end %><br /> <%= f.password_field :password, :placeholder => 'パスワード', autocomplete: "off" %> </div> <div class="field"> <%= f.label :password_confirmation %><br /> <%= f.password_field :password_confirmation, :placeholder => 'パスワードの確認', autocomplete: "off" %> </div> <div class="actions"> <%= f.submit "Sign up", class:'btn btn-success' %> </div> <% end %> <%= render "devise/shared/links" %> </div> </div> </div>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

moke

2017/03/31 02:36 編集

bootstrapの基礎とcssの基礎とrailsの基礎が分かっていないと 上記のことはできません、逆に分かっていれば、作業なので、やりたいことを丸投げしているような気がします。
hayabusakk

2017/04/02 04:27

ありがとうございます。 CSSの基礎がないので、それを勉強して作ってきます
moke

2017/04/03 04:09

すみません言い方がきつかったかも、具体的には、対応するclassをタグに記述する、及びcssをrailsに適用するだけです
guest

回答1

0

ベストアンサー

Bootstrapでフォームの体裁を整える時のdivタグは'form-control'だと思うのですが、それはさておき、Bootstrapのcssを適用させるのであれば、
<%= f.text_field :username, :placeholder => '北尾 恵太' %> を
<%= f.text_field :username, :placeholder => '北尾 恵太, class:'form-control' %>
とすればいいはずです。Bootstrap自体のオプションはBootstrap3日本語リファレンスで調べてください。
ただ、上記のコメントのとおり、css、HTML、railsのviewを色々と勉強された方がよろしいかと存じます。

投稿2017/04/18 15:15

s-show

総合スコア203

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hayabusakk

2017/04/18 15:19

ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問