初心者のプログラミングチャレンジ【７１～７５日目】

初心者のプログラミングチャレンジ【７１日目】

Webサイト模写 その１

細かい部分の修正が上手くできない日々です。

1. 直すと崩れるパターン
2. headerを直す
3. footerを直す
4. header、footerよし
5. 隠れた文字あり
6. 挑戦する
7. 消えた……。
8. バックアップ大事（涙）
9. baseと同じ要領で書いてみる
10. 大事故発生

grid枠の指定が良くない、HTML記述でdivを使って細切れにしているのが良くない、と思いました。baseでは表示されるけれど、これでは切り替えが利きません。baseの表示ごと、方法を変える方法はないかしら。

初心者のプログラミングチャレンジ【７１．５日目】

Webサイト模写 その１

grid指定の前に、HTMLを見直す必要がありそうです。

1. brは必要か？
2. 整っている、ように見える
3. paddingではない
4. marginか？
5. brを消す
6. 無事に表示される
7. お？

grid、flexの前に、HTMLを見直していたため、７１．５日目です。余計なbrを消したら、希望の光が見えました。

初心者のプログラミングチャレンジ【７２日目】

Webサイト模写 その１

希望の光に向かって、前進あるのみです。

1. baseは崩れない
2. tabletに挑戦
3. 余分なコードを消す
4. お試しflexは変化なし
5. display:block
6. 画像幅が広がらない
7. 修正してみる
8. block幅も広がらない
9. flex:auto
10. 問題は画像幅

header、footerも同じ状態で、画像を横幅いっぱいにすることができません。何か同じ間違いをしていると、推測して、対策を考えます。

初心者のプログラミングチャレンジ【７３日目】

Webサイト模写 その１

微妙な修正が、一番難しいと思っています。

1. base、tabletの切替えサイズ
2. 600→750
3. ちょっとずつ気になる
4. font、marginを修正
5. copyrightが気になる
6. HTML修正
7. お？
8. baseが崩れる
9. HTML修正
10. tabletが崩れる
11. 微妙に直る
12. 思い切ってinline-flex
13. 無事に表示される

大分、考えて書き直して、整えられるようになってきたと思います。gridとflex、inlineとblockの経験値が少し溜まってきました。小さな積み重ねが大切ですね。

初心者のプログラミングチャレンジ【７４日目】

Webサイト模写 その１

微妙な修正の積み上げ中ですね。

1. アイコンの挿入
2. fontawesomeを使用
3. HTMLを書く
4. tabletを書く
5. 表示される
6. 試しにinline
7. 変化なし
8. 右に寄らない
9. divで囲む
10. 右に寄らない
11. 宿題

どうしても右寄せにすることができません。inline、block、inline-○○などいろいろ試してみたのですが、どうしてもうまくいきませんでした。宿題です。

初心者のプログラミングチャレンジ【７５日目】

Webサイト模写 その１

微妙な修正の積み上げ中。いろいろ気になる部分があるのに、なかなか直せないですね。難しいです。

1. 気になる余白
2. 気になる文字ずれ
3. まずmargin
4. 無事に表示される
5. 次はfont-size
6. 無事に表示される
7. base、tabletがほぼ完成？
8. 課題１：フルサイズ
9. 課題２：集計結果
10. 課題３：上下のナビ
11. 課題４：写真100%幅
12. 課題５：フルサイズ
13. 課題６：写真100%幅
14. 課題７：アイコン

予想より多めに、解決していない問題がありました（反省）。今のところ、解決策が思い浮かばないため、次回からpcを書いていきます。

満稀（みつき）

大人だからこそ効率的に勉強したい運営者

TwitterContact

社会人スタートはブラック作業員から。コツコツ勉強を続けることで、ITエンジニアになることができました。これからも地道に『独学×資格×勉強=スキルUP&収入UP』を目指していきます。