[大邱AI学校]10819開発ログ39

2247 ワード

[勉強の内容]


Twiceホームページ実習



→左側部分と上部バーが固定されています.上部には放送画面が表示され、左右のキーを別の放送に切り替えることができます.(JavaScript機能なのでスキップ)

単位変換サイト


px・em変換計算機

(1)space-tween属性の中間要素がページの真ん中にない場合



nav .nav-center{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
  • 上面の部分はspace-tweenが適用された空間において、左右の要素の幅が異なるため、中央要素が中央に位置せず、片側に偏っている場合である.この場合、上記の方法を使用して、中央にある要素を中央に位置合わせできます.
  • (2)position:固定時の注意事項


  • fixedでwidth値が指定されていない場合、空間に3 D要素がある場合、fixedを持つ親領域のwidth値はサブ要素幅の和になります.従って、上図に示すように破砕現象が発生し、width:100%である.これを指定すると、元の設定の値が返されます.
  • (3)position:固定指定時の注意事項2



    前の
  • に示すように、ブラウザサイズを縮小すると、ナビゲーション内の3 D要素がレイヤをクラッシュさせるため、最小幅値(min-width)を指定する必要があります.
  • min-width: 1340px;指定すると、同じサイズのブラウザでは、すべての要素が1つの画面に入るのではなく、最小幅値で固定され、ブラウザが小さい場合は、画面に表示される部分はほんの一部だけです.
  • [困難な点]


  • [勉強の感想]


    カピケイトはトウィッチという外国のウェブサイトを実習した.講師は最新の機能がたくさん入っていると言っていましたが、検査中にこのページがどのように作られているのかよく見えないように隠していました.このように作成したページのコードを非表示にする方法があることに気づきました.