Q:视频中的.main中的float是不是可以去掉呢,因为.ct已经清除浮动了。
A:单纯的防止父元素塌陷的话可以不加,然而为了设置三栏式布局,之后需要将aside模块设置负边距,使其上移,如果main不设置float的话,aside就无法上移,因为块级元素都占了一行。
Q:视频中的第四个样式:.main .wrap可以删去main,直接设置wrap吧。
A:经测试删除后正常。
负边距在让元素产生偏移时和position: relative有什么区别?
负边距的设置像素时是相对自己偏移,按百分比设置偏移时是按照父容器的百分比,并且偏移后原始位置不保留。
如图,将父容器设置为1000px,main设置为50%,当column1设置负边距-20%时,移动了200px;所以是根据父容器的宽度设定的。
这里有个小问题,我对.mian添加了相对定位,再让column1偏移,蓝色的方块会被挡上,请问是为什么呢?
相对定位是相对自己偏移,并且偏移后原始位置保留。
使用负 margin 形成三栏布局有什么条件?
1.三栏放在一个容器中,并且浮动。
2.中间窗体宽度100%,左右固定宽高。
3.两栏设置负边距。
圣杯布局的原理是怎样的? 简述实现圣杯布局的步骤
1.父容器内设置三个浮动div,注意使用伪类清除浮动。
2.其中第一个主模块宽度设置为100%,其他两个宽度自定义。
3.父容器设置左右内边距,宽度为两边栏宽度。
4.左边栏设置margin-left:100%,右边栏设置margin-left:-宽度。
5.两边栏设置相对定位,分别左右移动自己宽度大小。
双飞翼布局的原理? 实现步骤?
1.父容器设置三个浮动div,第一个主盒子需增加一个div,注意使用伪类清除浮动
2.主盒子宽度100%,左右两边盒子宽高自定
3.左边的设置margin-left:-100%,右边的设置为margin-right:自己的宽度
4.为主盒子的子div设置左右外边距,大于左右两边盒子的宽度