外边距合并

CSS3技术难点总结

大憨熊 提交于 2019-12-05 17:38:59
一:DIV元素加 margin 会把父元素的 margin 也撑高 这个现象叫做外边距合并(Collapsing Margins)或 CSS样式margin叠加的问题。 如果相邻两个元素都有margin,那么间距会取两者较大的作为间距距离; 同理,对于包含的两个元素也一样,特殊的是如果包含的两个元素,父元素没有margin,而子元素有margin,并且父元素没有border和padding的话,那么子元素的margin会溢出到父元素外,要解决这个问题有很多方法,如设置1px的padding,或者设置透明的border等方法来防止margin溢出。 如图: 代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>ActiveX登陆实例</title> <meta name="generator" content="editplus" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <style type="text/css"> *{margin:0px;padding:0px;} body{font-size