高端手机网站定制,建设企业网站制作公司,一个人值多少钱,做水暖的网站垂直外边距的重叠 在网页中相邻的垂直方向的外边距#xff0c;会发生外边距的重叠 兄弟元素 兄弟元素之间的相邻外边距会取#xff08;绝对值#xff09;最大值#xff0c;而不是取和#xff0c;谁大取谁 特殊情况#xff1a;如果相邻的外边距一正一负#xff0c;则取两…垂直外边距的重叠 在网页中相邻的垂直方向的外边距会发生外边距的重叠 兄弟元素 兄弟元素之间的相邻外边距会取绝对值最大值而不是取和谁大取谁 特殊情况如果相邻的外边距一正一负则取两者的和 如果相邻的外边距都是负值则取绝对值较大的 兄弟元素的外边距重叠并对开发有利不用处理 需求将子元素移动到父元素的左下角 为上边的元素设置一个外边距box1
margin-bottom: 10px;
为下边的元素设置一个外边距box2
margin-top: 10px;
距离相隔10px 若距离设置为上边元素外边距为-20PX下边元素外边距是10PX则取10PX
如距离设置为上边元素外边距为-20PX下边元素外边距为-20PX则取20PX
完整代码
!DOCTYPE html
html langen
headmeta charsetUTF-8titleD/titlestyle typetext/css.box1{width: 100px;height: 100px;background-color: blueviolet;margin-bottom: -20px;}.box2{width: 100px;height: 100px;background-color: chartreuse;margin-top: -20px;}/style
/head
bodydiv classbox1/divdiv classbox2/div
/body
/html
