[大邱AI学校]10705開発ログ6
3618 ワード
[勉強の内容]
Z-index
positionタグおよびそのサブアイテムまたはサブアイテムのZ軸順序のタグ.より大きなz-index値を持つ要素は、より小さな値の要素の上に上書きされます.
z-indexが適用されていない状態は0と考えられる.したがって、z-indexを使用して値を加算すると、その要素は指定されていない要素を上書きし、上に移動します.3 Dフィーチャーを持つ絶対、固定、および2 D、3 Dフィーチャーは、3 Dフィーチャーを持つ相対的に使用できます.
大きな空間をつかむ必要がある場合は、2次元が望ましい.3 Dの場合、レイヤが重なる場合があります.
Float:水平位置合わせ[Float:すいへいいちあわせ]
この要素の概念をオフセットして、3 Dフィーチャーでz列を異なるソースにします.
デフォルトでは、2つの領域を作成すると改行され、同じ線上に配置したい場合はfloat、すなわちfloatとみなすことができます.この場合、2つの要素が重なり、ソートするために属性値を左、右にソートできます.
floatを使用する場合はclearと一緒に使用する必要があります.(ワニとワニの新しい関係)floatは同じ線上に置こうとしたときに使用され、clearは印刷機能をここまでマークして閉じています.
{clear:both;}表示左右都要关闭.
印刷の使用上の注意点
(1)固定された値を持つ親領域で印刷を使用して、レイヤのクラックを防止します.
px値ではなく%(可変値)の領域を指定した場合、親に固定値がなくてもブラウザのサイズを変更してもレイヤは破壊されません.これは珍しい状況だ.
親のwidth値は、指定した印刷の3つのwidth値の和以上である必要があります.
(2)親の高さ値がない場合は,子どもの高さ値に適用する.しかし,子供が3次元で親の高さ値がない場合,親の高さ値に影響を与えることはできない.つまり、印刷された領域を使用しても、その高さの値は親領域に影響しません.
(3)印刷を使用する場合,位置状態は純3次元の位置:absolute,fixedを使用できない.代わりに静的で相対的に使用されます.
@html
<div class="clearfix"></div>
@css
}
.clearfix{
clear: both;
}
Over Flow
overflow : hidden ;
領域内にコンテンツが多すぎると、領域を超えたコンテンツが隠されます.この要素を使用すると、3 Dサブボディの高さの値でも親に影響します.
overflow-y : scroll ;
スクロールを使用してy軸を超えた内容を表示します.
overflow-x : scroll ;
スクロールを使用して、x軸を超えた内容を表示します.
Flex
flex指定要素の子はすべてx軸で整列しています.左から右へ並べ替えます.
flex-direction
:ソート方法の変更
flex-direction: row-reverse;
逆順に並べる.
flex-direction: column-reverse;
逆順でy軸に整列します.
flex-wrap
flex-wrap: nowrap; これはデフォルト値で、子供たちのwidthサイズが親のサイズより大きい場合、自動的にサイズを調整し、親の領域に入ることができます.
flex-wrap: wrap; 子供たちのwidthの大きさの和が親より大きいと、子供たちの大きさは変わらず、改行現象が発生します.
justify-content
:t x軸整列ラベル
左から
右端から
中央揃え
両側を揃え、要素間に空白を作成します.
両端が揃えられていますが、両端に少しスペースが残っています.
align-item
※flexboxヘルプサイト
https://flexbox.help/
一元的なソート
margin: 0 auto;
:よく使われるブロック要素
left: 50%;
margin-left: -150px;
:エレメントの左の始点に対してブラウザの50%に配置し、エレメントの幅の1/2に-(負)の値を指定します.欠点は、領域のサイズが変化するたびにmarging-left値を変更することです.
https://css-tricks.com/centering-css-complete-guide/
[困難な点]
以前学んだ馬金のようなものは、今日学んだものが言及すると一致しません.
[解決策]
やはり復習しなければならないようです.また,今後も学習の要素がページ構成でどのように利用されるかを考え,構想,学習を行う.
[勉強の感想]
一週間の進度は思ったよりたくさん学んだようです.前述したように、復習と繰り返しが最も重要なようです.今日は開発ログを見てから寝ます
Reference
この問題について([大邱AI学校]10705開発ログ6), 我々は、より多くの情報をここで見つけました
https://velog.io/@minkyeong43/대구-A.I.스쿨-21.07.05-개발일지6
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
やはり復習しなければならないようです.また,今後も学習の要素がページ構成でどのように利用されるかを考え,構想,学習を行う.
[勉強の感想]
一週間の進度は思ったよりたくさん学んだようです.前述したように、復習と繰り返しが最も重要なようです.今日は開発ログを見てから寝ます
Reference
この問題について([大邱AI学校]10705開発ログ6), 我々は、より多くの情報をここで見つけました
https://velog.io/@minkyeong43/대구-A.I.스쿨-21.07.05-개발일지6
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
Reference
この問題について([大邱AI学校]10705開発ログ6), 我々は、より多くの情報をここで見つけました https://velog.io/@minkyeong43/대구-A.I.스쿨-21.07.05-개발일지6テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol