面接シリーズ(一)よくあるCssとHTMLの試験問題
面接シリーズは継続的に更新され、興味のあるパートナーを長期的に維持することができます.
なぜ面接シリーズを書くのか、ネット上の面接問題はもうたくさんあります.私も前に面接の間に素早く突撃したので、ファーストフード式の勉強をして、勉強を忘れて、勉強を忘れました.ただ面接のために面接をして、気持ちのいい会社を辞めるまで、自分のこのような学習方式が間違っていることを悟って、もっと総括して考えて、持続的に勉強しなければなりません.この面接シリーズを書くのは、学んだ知識をまとめるためであり、勉強を続けるように促すためである.能力が限られているので、間違いを見つけたら伝言を残して注意してください.感謝します.
面接はすべてやり方で、一部のものはやはり暗記しなければならない.
1.フローティングのクリア(手書きが必要な場合があります)
2. BFC
BFC:単独のコンテンツで、どのようにレンダリングされても外部に影響を与えない要素です.
BFC形成条件:
overflow:visibleではありません
float:noneじゃない
display:flexまたはinline-block
义齿
3.absoluteとrelativeはどのような位置づけに基づいているのか
absoluteは最近の要素の定義状況に基づいて位置決めされ、親要素の位置決めをbodyまで繰り返す.
relativeは自分の位置に基づいています
4.垂直方向の中央と水平方向の中央
水平中央(一般的に4種類)
(1)行内要素:text-align:center;
(2)ブロックレベル要素:中央要素定幅margin:0 auto
(3)位置決め要素幅固定:position:absolute;left:50%;margin-left:-幅の半分;
(4)位置決め要素不定幅:position:absolute;left :50%; transform: translateX(-50%)
垂直方向中央揃え
(1)行内要素:line-height=height
(2)ブロックレベル元素定高:position:absolute;top:50%;margin-top:-高さの半分
(3)位置決め要素不定高:position:absolute;top:50%; transform: translateY(-50%)
5.line-height継承の特性
(1)親要素のline-heightが数値または比である場合、子要素はこの値を直接継承します.
(2)親要素のline-heightがパーセンテージである場合、子要素は親フォント*パーセンテージで算出された値を継承します.
6. em,rem,px
px:通常の絶対長単位
Em:相対長さ単位で、親要素に対して、よく使用されません.
rem:相対長さ単位でもあり、ルート要素に対して応答式が一般的です.rはrootです.remはmedia-queryと組み合わせて、階段的な応答試験レイアウトを実現することができる.
7.Webビューポートサイズ(vw,vh)
vwとvhを話す前に3つのサイズを知っておく必要があります.彼らはそれぞれ
(1)window.screen.heightスクリーン高さ
(2)window.InnerHeight Webビューポートの高さは、ブラウザの頭とあごを除いて、Webコンテンツを表示できる高さです(ここでは、ブラウザで携帯電話をシミュレートする場合、この値がwindow.screen.heightと本体テストに等しいことに注意してください).
(3)document.body.ClientHeight body要素の高さ
vw=Webビューポート幅/100
vh=Webビューポートの高さ/100
vmin:1 vwと1 vhの最小値をとる
vmax:1 vwと1 vhの最大値をとる
8.箱模型(cssの中の重点、経典の面接問題)
ボックスモデルは2種類のIEボックスモデルとW 3 cボックスモデルに分けられます
w 3 cボックスモデルwidthとheightはcontent部分のみを含む
IEボックスモデルwidthとheightはcontent+padding+border
ie 8+ブラウザでbox-sizing制御で使用できるボックスモデル
border-boxはIEボックスモデルを使用しています
content-boxは標準ボックスモデルで
9.margin負の値とmarginが重なる
marginのtopとleftが負の値の場合、要素は上または左に移動します.
marginのbottomとrightが負の値の場合、その要素の下または右の要素は、上または左に移動し、それ自体は影響を受けません
marginオーバーラップ:隣接する要素のmargin-topとmargin-bottomがオーバーラップし、空白の要素もオーバーラップします
上一篇:面接シリーズ(二)js基礎知識
なぜ面接シリーズを書くのか、ネット上の面接問題はもうたくさんあります.私も前に面接の間に素早く突撃したので、ファーストフード式の勉強をして、勉強を忘れて、勉強を忘れました.ただ面接のために面接をして、気持ちのいい会社を辞めるまで、自分のこのような学習方式が間違っていることを悟って、もっと総括して考えて、持続的に勉強しなければなりません.この面接シリーズを書くのは、学んだ知識をまとめるためであり、勉強を続けるように促すためである.能力が限られているので、間違いを見つけたら伝言を残して注意してください.感謝します.
面接はすべてやり方で、一部のものはやはり暗記しなければならない.
1.フローティングのクリア(手書きが必要な場合があります)
.clearfix：after{
display:block;
clear:both;
content:'';
visibility:hidden;
height:0
}
.clearfix{
zoom:1
}2. BFC
BFC:単独のコンテンツで、どのようにレンダリングされても外部に影響を与えない要素です.
BFC形成条件:
overflow:visibleではありません
float:noneじゃない
display:flexまたはinline-block
义齿
3.absoluteとrelativeはどのような位置づけに基づいているのか
absoluteは最近の要素の定義状況に基づいて位置決めされ、親要素の位置決めをbodyまで繰り返す.
relativeは自分の位置に基づいています
4.垂直方向の中央と水平方向の中央
水平中央(一般的に4種類)
(1)行内要素:text-align:center;
(2)ブロックレベル要素:中央要素定幅margin:0 auto
(3)位置決め要素幅固定:position:absolute;left:50%;margin-left:-幅の半分;
(4)位置決め要素不定幅:position:absolute;left :50%; transform: translateX(-50%)
垂直方向中央揃え
(1)行内要素:line-height=height
(2)ブロックレベル元素定高:position:absolute;top:50%;margin-top:-高さの半分
(3)位置決め要素不定高:position:absolute;top:50%; transform: translateY(-50%)
5.line-height継承の特性
(1)親要素のline-heightが数値または比である場合、子要素はこの値を直接継承します.
(2)親要素のline-heightがパーセンテージである場合、子要素は親フォント*パーセンテージで算出された値を継承します.
6. em,rem,px
px:通常の絶対長単位
Em:相対長さ単位で、親要素に対して、よく使用されません.
rem:相対長さ単位でもあり、ルート要素に対して応答式が一般的です.rはrootです.remはmedia-queryと組み合わせて、階段的な応答試験レイアウトを実現することができる.
7.Webビューポートサイズ(vw,vh)
vwとvhを話す前に3つのサイズを知っておく必要があります.彼らはそれぞれ
(1)window.screen.heightスクリーン高さ
(2)window.InnerHeight Webビューポートの高さは、ブラウザの頭とあごを除いて、Webコンテンツを表示できる高さです(ここでは、ブラウザで携帯電話をシミュレートする場合、この値がwindow.screen.heightと本体テストに等しいことに注意してください).
(3)document.body.ClientHeight body要素の高さ
vw=Webビューポート幅/100
vh=Webビューポートの高さ/100
vmin:1 vwと1 vhの最小値をとる
vmax:1 vwと1 vhの最大値をとる
8.箱模型(cssの中の重点、経典の面接問題)
ボックスモデルは2種類のIEボックスモデルとW 3 cボックスモデルに分けられます
w 3 cボックスモデルwidthとheightはcontent部分のみを含む
IEボックスモデルwidthとheightはcontent+padding+border
ie 8+ブラウザでbox-sizing制御で使用できるボックスモデル
border-boxはIEボックスモデルを使用しています
content-boxは標準ボックスモデルで
9.margin負の値とmarginが重なる
marginのtopとleftが負の値の場合、要素は上または左に移動します.
marginのbottomとrightが負の値の場合、その要素の下または右の要素は、上または左に移動し、それ自体は影響を受けません
marginオーバーラップ:隣接する要素のmargin-topとmargin-bottomがオーバーラップし、空白の要素もオーバーラップします
上一篇:面接シリーズ(二)js基礎知識