一、盒子居住
(1)(未知盒子寬高)
transform居中,可以不知道寬高
padding: 20px;
background: orange;
color: #fff;
position: absolute;
top: 50%;
left: 50%;
border-radius: 5px;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}*//*
flex居中,可以不知道寬高
body
width: 500px;
height: 300px;
background: orange;
color: #fff;
}*/
(2)已知盒子寬高
/*絕對定位居中
width: 400px;
height: 18px;
padding:20px;
background: orange;
color: #fff;
position: absolute;
left:0;
right:0;
top: 0;
bottom: 0;
margin: auto;
}*//*
絕對定位寬高各一半居中
width: 400px;
height: 18px;
padding: 20px;
background: orange;
color: #fff;
position: absolute;
top:50%;
left:50%;
margin-top: -9px;
margin-left: -200px;
}*/
二、待整理。。 CSS常見面試題
1.盒子模型有幾種型別,區別是什麼 標準盒模型 寬度 內容的寬度 content padding border margin ie低版本盒模型 寬度 內容的寬度 content padding border margin 2.box sizing屬性 content box 內容的寬度是conten...
常見的的CSS面試題目
1 介紹一下標準的css的盒子模型?與低版本ie的盒子模型有什麼不同的?標準盒子模型 寬度 內容的寬度 content 邊框寬度 border 內邊距 padding 外邊距 margin 低版本ie盒子模型 寬度 內容寬度 content border padding 外邊距 margin 與標準...
HTML和CSS常見面試題
css 選擇符 1.id選擇器 myid 2.類選擇器 myclassname 3.標籤選擇器 div,h1,p 4.相鄰選擇器 h1 p 5.子選擇器 ul li 6.後代選擇器 li a 7.萬用字元選擇器 8.屬性選擇器 a rel external 9.偽類選擇器 a hover,li nt...