記事一覧
模写修行 無料編を終えてポイント
矢印はCSSで作る
ポイント
・疑似要素after,beforを親要素に当てる。
・親要素にはposition:relateiveをあてる
・疑似要素には複数セレクタで共通の要素、positon:abusorut,top,bottom,rightをあてる
見出しのコンポーネント化
ポイント
・フォントサイズ、カラー、配置（text-aline）に注目してコンポーネント化
例）
サイズ
.c-ti
模写コーディングを終えてポイントまとめ
Designの確認
カラーの確認
・背景色、文字色、アイテムの色の確認
・カスタムプロパティ化しておく。
:root {--color-bg-light: #eceff4 ;}
コンテンツ幅の確認
・sp版、pc版のメイン幅の確認
・container,wrapper,innerの確認
・レイアウトのカスタムプロパティ化
レスポンシブ化するときに横並びになる要素の確認
・横並びにする場合はブ
wordpress 基礎
フォルダ、ファイル
wp-config.php
データベースの情報などを記載するファイル
wp-contentフォルダ内のファイル
制作していくブログやサイトの情報を管理
pluginsフォルダ：インストールしたプラグインを入れるフォルダ
themesフォルダ：テーマを入れるフォルダ
uploadsフォルダ：アップロードした画像や動画などのメディアが入るフォルダ
それ以外はコアファイル
PH
Gitに関してのメモ
Gitとは
ファイルの変更履歴を記録するバージョン管理システム
リポジトリ
保管したファイルをバージョン管理するところ
PC内：ローカルリポジトリ（変更履歴を保存するための隠し領域）
変更履歴を隠し領域に記録する操作→コミット
共同作業の仕組み
リモートリポジトリを用意して、各作業メンバーのローカルリポジトリと同期させる。
注意：プッシュ／プルという作業を行わないと同期されない
ブランチ
変
1/2 不明点の復習
オブジェクト指向とは
いかに効率よく開発を行うかを突き詰めた考えかた、概念
設計：下記の3つを主体に設計する
カプセル化：他のプログラムから鑑賞されないプログラム
継承：同じようなプログラムは共通化して使う考え方（共通の部分はまとめてあつかう）
ポリフォーリズム：汎用的なかたちにできるようにしましょうという考え方（多様性）
メソッド
オブジェクトの中にある関数
メソッドのあとに（）が
11/06学習内容（CSS設計）
CSSの命名規則
後から書き換えたり、他人が見る想定でCSSを書いていく
「良いCSS」の４条件
予測しやすい
再利用しやすい
保守しやすい
拡張しやすい
予測しやすい
class名のつけかたにルールがある、スタイルの優先度が整理されている
修正する時に、CSSの変更で予想外のことが起こりにくい
修正する時に、どこにどのスタイルが当たっているかの予測がつけられ（探す手間が省ける）
自
11/3 学習内容（セレクタの書き方）
複数指定
書き方
◯,◯,◯ {〜}
「,」で区切る
効果
複数のタグやクラスに対して同じCSSをまとめて適用させる
イメージ
○ and ○ and ○ すべてのセレクタに適用
子孫セレクタ(絞り込み)
書き方
◯ ◯ {〜}
半角スペース空ける。
イメージ
○ に含まれている ○ にのみ適用
子セレクタ
書き方
◯ > ◯ {〜}
「>」をいれる
1つ下の階層の子要素にのみ適
11/1 学習内容（calc関数）
calc関数
→CSSで四則演算（足し算・引き算・掛け算・割り算）ができる関数
どんなときに使う？
要素を均等に配置したいとき
特にレスポンシブで「○個目の要素から折り返したい」というときにflex-wrapと併用すると便利。
計算の優先順位
かっこ内にある数式
掛け算・割り算
足し算・引き算
記述のときの注意点
「+」「-」の前後に半角スペースを入れる
スペースを入れないと数
10/29 学習内容
レスポンシブなぜレスポンシブしなければいけないのか？
様々なデバイスがある中でそのデバイスごとにHTMLを作るのは面倒。
一つのHTMLを変更することでPC用、タブレット用の管理、更新をできるようにする。
head内の記述
<meta name="viewport" content="width=device-width, initial-scale=1" >
metaタグとしてviewpo
要素の中央寄せまとめ
前提
要素を中央に寄せる場合、まず中央寄せの対象となる要素が、以下のどれになるのか確認する
ブロック要素
ex hタグ、divタグ、pタグ
インライン要素
ex spanタグ、aタグ
インラインブロック要素
display: inline-block;した要素
左右中央に寄せたいパターン
【インライン要素、インラインブロック要素の場合】
1,中央寄せにしたい要素の親要素に「t