記事一覧
精製されたドットは並べられなければならない。
要件：背景をドット柄で埋め尽くす方法の理屈を述べよ
フリーランスのWebデザイナーの小林さんが、ツイッターでつぶやいてくれる様々なCSS技巧について、「なんとなく判るけど、どんな理屈でそうなってるんだっけ？」を実際に触って試してみたいと思います。
・「radial-gradient」が夢と現実に境界線を敷く background-image:
radial-gradient(#ddd 3
試したいことの効果は予測できるが、、そのための時間でまずやってみたくなるのがヒトの性。
要件：デザイン～コーディングの練習にあたって、早く回す方法を考える。
「まったく作業がすすまない！」
休職期間中、これまでコーディング中心であまり手を出していないサイトのデザインの方もやってみようと、よく行くお店のサイトのデザインに挑戦してみましたが、あまりにも手が進まない。
これは切り口と言うか、もっと別のやり方を考えた方がよさそうだと思って、以下のことを試してみました。
・一から作るの
グリッドという単語から連想するもので世代は特定できない。しかし趣向は判明する。
要件：cssグリッドを使ってみよう。
「ここに使えないかなぁ？」
コロナの影響による休職期間中、レベルアップのため過去に構築したサイトをスリムに作り直すということにチャレンジする中で、Flexboxレイアウトしている箇所を今まで実務で使うことのなかった「CSSグリッド」を使ってやってみようと、先人の英知を検索してみました。
大まかに
親要素
・宣言
「グリッドやろうぜ！」
「Acces
予定の斜め上へ進捗しなさい。 上手くいかなくても、全てが今より下になることはありません。
「これは不味いなぁ」
コロナによる経済活動の停滞のおかげで、会社から自宅待機を命じられ、一番嫌だったのが実務に携われないことでした。
仕事ができないなら、普段できない勉強の時間に充てるのは無論ですが、やはり業務としてHTMLやCSS、WP周りの記述に精通している段階でもないので、そこから長期間離れるのは嫌なわけです。
記述の際に疑似要素などが仕込みやすい様に予めspanを仕込んだり、class
14 Days Later
「2週間自宅待機で！」
リモートワークに移行した2営業日後に2週間の自宅待機という、人生の瞬間最大風速がなかなか強かった4月第2週目の月曜日。
翌日から毎日が日曜日（コロナで外出自粛）状態とあいなりまして、2週間経過しました。その間にやっていたことなどをつらつらと。
朝の散歩
これはリモートになった際にやろうと決めていました。往復2時間の通勤時間が基本公共交通機関で立ったままなので、少なく
それらは横スクロール時にスナップされる。 ただし火狐は居場所を示さない（横スクロール、overflow-x: scroll、scroll-snap-type、scroll-snap-align）
今の会社では、レスポンシブでPCからスマホなどのモバイルにデザインが切り替わる際、レイアウト等の裁量はコーダーさんに任されています。
PC画面上で横並びになっている要素をタブレットやスマホで見せる際、私なんかは縦に1～2列並べる傾向があるわけですが、流石に数か月同じことをしていると「縦にズラズラ並ぶのをスクロールしていくのって芸がないよね？」と思いまして、JQの「slick」みたいに横にスクロー
二種の一覧を作成せよ。それらは同種の関連する要素に繋がる。
要件
：カスタム投稿で検査設備と検査紹介の名称一覧ぺージを作る。
：カスタム投稿で検査紹介と検査設備の詳細を記した一覧ページを作る。
：検査紹介ページで、各検査紹介の項目にあるリンクから該当する検査設備ページへ飛ばす。
要件（追加）
：カスタム投稿で検査内容の名称一覧ぺージを作る（検査設備とデザイン共用）。
：各検査紹介のリンクから該当する検査設備項目へ飛ばす。
要件（追加）
後出しがくる
それらは6つの要素からなる。そして配置され重なり合わなければならない。
要件：
A：5つの画像と1つの文章からなる要素を配置する。画像についてはカーソルが乗った際にリンクボタンが出てくるようにする。その際、画像全体を透過した黒で覆うこと。
B：5つの画像はすごくゆっくり別の画像とフェードインで入替えを行う。画像が入れ替わるタイミングは、5つの画像それぞれでバラバラにすること。
PC画面いっぱいに配置された5つの画像を『「slick」でフェードイン/アウトする