taro

taro

模写コーディング2-2

2-1のレスポンシブ版 左：元サイト　右：模写 header ・navが横スクロールになっていた 　overflow-x: scroll; を指定する pickup ・flex-direction: column; で記事を縦積みに ・各記事のwidthを100%にする（PCサイズで32%にしているため） main ・widthを100%にする（PCサイズで65%にしているため） ・flex-direction: column; で記事を縦積みに asid

taro

    • 模写コーディング2-1

      Codestepさんの中級編にチャレンジ。2カラムのサイト模写。 デモサイト：https://code-step.com/demo/html/blog/ PC 左：元サイト　右：模写 header ・headerタグにstyle当てたいときはidかclassつけるようにしよう ・h1の子要素にimgタグでロゴ画像指定 ・headerに width: 100%; を設定 ・ヘッダーは追随するので position: fixed; を指定。z-indexで要素の重な

      taro

      • 模写コーディング1-2

        1-1のレスポンシブ版 左：元サイト　右：模写 header ・タイトルロゴとナビが縦に並んでいるので、flex-direction: column; で縦並びに ・PCサイズでheightを指定していたため、height: auto; をつけることで縦の高さを自動的に合わせる ・インスタの画像のwidthを指定 ・元サイトでは　最初のli要素を左詰め・余白なし、それ以外のli要素は左に余白を指定してた mainvisual ・PC版とレスポンシブで画像を切り

        taro

        • 模写コーディング 1-1

          Codestepさんの初級編にチャレンジ（著作権フリーありがとうございます） デモサイト：https://code-step.com/demo/html/portfolio1/ PC 左：元サイト　右：模写 header ・インスタのアイコンが若干下がり気味になってしまった 　→元サイトはnavの高さに余裕があるから？右上が基準になってるから？原因が分からない、、 ・ロゴとnavを横並びにするのに margin-left: auto; を使用した 　→親要素に ju

          taro

        模写コーディング2-2

        taro

          やりたいことがなかった私が、webデザイナーになりたいと思ったきっかけ

          私はこのままでいいのだろうか、と思ったのが事の始まり。気持ちの整理のために書き連ねます。 簡単に自己紹介。 ・社会人4年目（今年26歳） ・転職歴1回 ・現職エンジニア ・現在Webデザインを独学で勉強中 就活当時、やりたいことが分からなかった大学3年生の3月から就活をスタート。 自己分析をしてみるものの、全然やりたいことが分からない。むしろやりたくないことの方が多い。 キャリアプラン？やりたいことも分からないのにキャリアプランもクソもあるか、と思っていた。 大学

          taro

          やりたいことがなかった私が、webデザイナーになりたいと思ったきっかけ

          taro