1.勉強の内容

(1)ページ練習
ユーチューブ(https://www.youtube.com/)の左側領域とMainIn領域について動作した.
(本課程後の独学課程)




ホームページの大まかな部分が完成し、選択可能な特徴部分にはt位置に似た部分が多く、特に開発者ツールで見るとコードが複雑であることがわかります.
また、twitterやyoutubeや動画を提供しているサービスサイトなので、マウスをタッチすると動画が再生されるので、この部分はJavaScriptの機能を利用していないと思います.
△今は文法を単独で勉強する道がまだ長い....
(2)学習内容

単語が切り捨てられないように改行を作成

フッター領域作業で前回実習時の左フッター領域と似た領域.
前回の仕事では、適当に<br>と書いて改行しました(もちろん、下に立っているのはお互いとGoogle本社住所と電話番号の部分が<br>です).

開発者として現れるなどの単語がカットされる現象が現れた.

<footer id="youtube-footer">
						<div class="txt-wrap">
							<a href="#">정보</a>
							<a href="#">보도자료</a>
							<a href="#">저작권</a>
							<a href="#">문의하기</a>
							<a href="#">크리에이터</a>
							<a href="#">광고</a>
							<a href="#">개발자</a>
						</div>
						<div class="txt-wrap">
							<a href="#">약관</a>
							<a href="#">개인정보처리방침</a>
							<a href="#">정책 및 안전</a>
							<a href="#">youtube 작동의 원리</a>
							<a href="#">새로운 기능 테스트하기</a>
							
						</div>

Aタグで単語をかばう部分なので改行はできませんが、ここで使える方法は

word-break: keep-all;

a tag上のword-break:keep-all;という文法が使われています.

これにより,開発者という部分が切り取られず,意味の単語が1つだけ同じ行に並んでいることが分かる.
word-breakに関連するその他の内容は、次のとおりです.
https://wit.nts-corp.com/2017/07/25/4675
次のブログで勉強を増やしました.

複数行の交差軸(y軸)の位置合わせを指定するalign-content

flexbox layoutを使用すると、default設定に毎回移動します.
align-contentはalign-contentと呼ばれるプロパティです.スピンドル(x軸)にセクションが置換されているため、Flexアイテムが複数行表示されている場合、align-contentプロパティでは、クロス軸上のFlexアイテム間の間隔を指定できます.

したがって、この設定でブラウザウィンドウのサイズを変更しても、自然な移動に変換できます.
stretch(default)値はflexエントリを増やして交差軸に配置します.

白が現れる主なエリアは何ですか?

作業の完了とブラウザのサイズ変更中に白い部分が生成されました.

授業前に一人で悩んだ(初期化作業に問題があったと直感的に教えてくれた).
問題はBody tagで、スクロールはブラウザベースなので、下部のbody tagは白く表示されます.
解決策:初期化時に作成したbody tagに#21121色を入れる.
css code

html, body {
	width: 100%;
	height: 100%;
	background-color: #212121;
}

上記の方法で問題を解決した.

2.実習

ダウンソース:
https://github.com/Yeonsu-Hong/Daegu-AI-school-files

3.困難な内容&解決方法

何の難点もない.

4.感想

予定していたレッスンが終了し、独学部分を開始.
以降YouTubeサイトエンディングとNAVERモバイルバージョンが終了しJavaScript部分が残っている.
一人で本を読んでjavascriptの文法の部分を勉強して、以前fortranを勉強したような感じがします.
早く読んで、復習して、開発中に修正した部分で、自分の実力を固めて、9月にはどんな項目があるか分からないけど、足りない時間を補ってほしい.