HTML表格行之间的间距

45 浏览
0 Comments

HTML表格行之间的间距

这是一个我制作的相当简单的表格的代码。问题是在表格的第一行和第二行底部有额外的空白间隔。为什么会这样？我尝试了多个解决方案，但都没有起作用。

body, html { 
    height: 100%;
}
body {
    background-color: #a00000;
    margin: 0; /* 删除浏览器默认添加的边距 */
}
.wrapper {
   display: flex;
   height: 100%;
}
table {
    margin: auto;
    background-color: #fff;
}
img {
    max-width: 120px;
    max-height: 120px;
    border: solid 5px #a00000;
    background-color: #a00000;
}




    
        
        Bobcat Menu

0

1 答案

0 Comments

HTML表格行之间的间距是指在每个

元素周围没有额外间距的情况下，元素添加"display: block;"以确保背景不会通过显示。以下是解决方法的代码：

body,
html {
  height: 100%;
}
body {
  background-color: #a00000;
  margin: 0;
  /* remove default margins added by browsers */
}
.wrapper {
  display: flex;
  height: 100%;
}
table {
  margin: auto;
  background-color: #fff;
}
img {
  display: block;
  max-width: 120px;
  max-height: 120px;
  border: solid 5px #a00000;
  background-color: #a00000;
}





  
  Bobcat Menu

以上代码将在每个

元素周围添加显示属性"display: block;"，使得元素没有额外的间距，并修复了背景透过的问题。

0