2023-07-01から1ヶ月間の記事一覧
初めに Progateで学んだ内容で自分が躓いた内容を理解し効率よく学ぶため、かつ備忘録として記事を書いていこうと思います 結論 @post =Post.newという空箱を用意し、@post.saveで投稿内容が保存される 完成物 HTML <div class="main posts-new"> <div class="container"> <h1 class="form-heading">投稿する</h1> <div class="form"> <%= form_tag('/posts/create</div></div></div>…
初めに Progateで学んだ内容で自分が躓いた内容を理解し効率よく学ぶため、かつ備忘録として記事を書いていこうと思います 結論 @post =Post.newという空箱を用意し、@post.saveで投稿内容が保存される 完成物 HTML <div class="main posts-new"> <div class="container"> <h1 class="form-heading">投稿する</h1> <div class="form"> <%= form_tag('/posts/create</div></div></div>…
初めに Progateを学習して躓いた部分をアウトプットして学習効率を上げると共に備忘録がてらに日記を書いていきます。 結論 クラスで定義したメソッドを呼び出すためにはインスタンス.メソッド名 具体例 index.rb class Event attr_accessor :name def show …
初めに Progateを学習中に躓いたところをアウトプットして学習効率を上げると同時に備忘録としても記事を書いていこうと思います。 結論 idを含むURLのルーティングは後に回す ルーティングの順番によって表示されるものが変わってくる。 routes.rb Rails.ap…
初めに Progateを学習して躓いた部分をアウトプットして学習効率を上げると共に備忘録がてらに日記を書いていきます。 結論 クラスで定義したメソッドを呼び出すためにはインスタンス.メソッド名 具体例 index.rb class Event attr_accessor :name def show …
初めに Progateを学習して自分が躓いたところのアウトプットを行うことで学習効率を上げるかつ備忘録がてらに書きます 結論 クラスからインスタンスの生成までの流れは抽象的なものから具体的なものにしていくこと クラスは設計図、インスタンスは具体的なモ…
初めに Progateを学習して自分が躓いたところのアウトプットを行うことで学習効率を上げるかつ備忘録がてらに書きます 結論 クラスからインスタンスの生成までの流れは抽象的なものから具体的なものにしていくこと クラスは設計図、インスタンスは具体的なモ…
初めに Progateの学習での学習効率を上げるために、躓いたところをアウトプットすることで備忘録を作るがてらに学習効率を上げることを目的として書きます selfとは self.変数名とすることでインスタンス変数として扱える インスタンスメソッドでは変数”self…
初めに Progateを学習中に躓いたところを中心に復習がてらにアウトプットしていきます! 目標物 完成前ビュー 完成ビュー 結論 border-boxを使いこなすことでボタンの下に影を作り出す。 完成前のコード HTML <span class="btn message">さっそく開発する</span> CSS .message { padding: 15px…
初めに Progateを学習中に躓いたところを中心に復習がてらにアウトプットしていきます! 目標物 完成前ビュー 完成ビュー 結論 border-boxを使いこなすことでボタンの下に影を作り出す。 完成前のコード HTML <span class="btn message">さっそく開発する</span> CSS .message { padding: 15px…
*初めに Progagteで躓いたところを中心にアウトプットがてらに記事にしてみました。 要素どうしを重ね合わせるためにposition:absolute;を使用する。 HTML では要素どうしが重なり合うということはありません。 画像と文字を重ねてみたり、画像と画像を重ね…
*初めに Progagteで躓いたところを中心にアウトプットがてらに記事にしてみました。 要素どうしを重ね合わせるためにposition:absolute;を使用する。 HTML では要素どうしが重なり合うということはありません。 画像と文字を重ねてみたり、画像と画像を重ね…
初めに Progeteで学習中に躓いたところをアウトプットしていきます。 結論 インライン要素とブロック要素は大きさが微妙に違ってくる。 インライン要素で空白を作った場合と、ブロック要素で空白を作った場合では位置がずれる インライン要素とブロック要素…
初めに Progeteで学習中に躓いたところをアウトプットしていきます。 結論 インライン要素とブロック要素は大きさが微妙に違ってくる。 インライン要素で空白を作った場合と、ブロック要素で空白を作った場合では位置がずれる インライン要素とブロック要素…
初めに Progateを学習して自分が躓いたとこを備忘録そして自分の理解向上のためにアウトプットします。 marginのtopとbottomが効いていない。 今回はプレビューの画像にもあるようにProgateとその他の会社概要3つに対して上下左右に40pxの空白を生じさせる…
初めに Progateを学習して自分が躓いたとこを備忘録そして自分の理解向上のためにアウトプットします。 marginのtopとbottomが効いていない。 今回はプレビューの画像にもあるようにProgateとその他の会社概要3つに対して上下左右に40pxの空白を生じさせる…
初めに Progateの初級編を一通り終えて、道場編にトライしている時、躓いた部分を自分なりに解説をし、備忘録として残すためこの記事を書きます。 floatとは何か? 縦に並んでいる要素を横並びするプロパティ 具体例 HTML <div class="header-list"> <ul> <li>プログラミングとは</li> <li>学べるレッス</li></ul></div>…
初めに text-align:center、margin:autoを使用する際に非常に重要になってくるので、備忘録がてらに書きます! インライン要素について 行の中の一部のまとまりのことを示します。 テキスト文しか横の幅がないため、左右にはスペースが存在する marginで上下…
初めに margin:0 auto;とtext-align:center;の備忘録として書きます。 自分なりに調べてわかりやすい解説を参考にしながらアプトプットしていきます。 結論 中央寄せしたい要素がブロック要素か、インライン要素かによって変わります。 中央寄せしたい要素が…
初めに margin:0 auto;とtext-aligin:center;の備忘録として書きます。 自分なりに調べてわかりやすい解説を参考にしながらアプトプットしていきます。 結論 中央寄せしたい要素がブロック要素か、インライン要素かによって変わります。 中央寄せしたい要素…
初めに! ・ProgateのHTML&CSSの初級レッスンを終えて躓いたところを備忘録として書いていきます。 marginとpaddingの違いについて ・margin borderの外側の空白 ・padding borderの外側の空白 こんなイメージを持っていただければいいと思います。 理解す…
・初めに ・今回は箇条書きで使用されるリストマークを消すために使用される ”list-style:none;”について自分がうまく出来なかったことと、 どうすればうまくリストマークを消すことができるか書いていきます。 ・目標物 リストマークを消して右のような状態…