html - CSS 填充参数未加载

Question

这是一个表（标签），其中第一列包含用户名，第二列包含该特定主题的内容

我为表格制作了一个css，其中的定义应该将填充设置为0。但是，我注意到padding: 0px 0px;没有效果

浏览器：铬

主题的 CSS

.TOPIC_STYLE {
    border-collapse: collapse;
    border:0px solid black;
    padding:0px 0px;

    font-family: '华康少女文字 - Kelvin';
    font-size: 18px;
    color: #819FF7;
}

这是表格的代码：<table class=TOPIC_STYLE align=left>

2016-08-13 - 完整的代码集与我的旧笔记本电脑一起丢失。

目标：消除红圈中的空白。

我为表格准备的其他 CSS：

                        .TOP_LEFT {
                                background-image: url(top_Left.png);
                                background-repeat: no-repeat;
                        }
                        .TOP_RIGHT {
                                background-image: url(top_Right.png);
                                background-repeat: no-repeat;
                        }
                        .VERTICAL_LEFT {
                                width:  150px;
                                height: 30px;

                                text-align: center;

                                background-image: url(vertical_Left.png);
                                background-repeat: repeat-y;
                        }
                        .VERTICAL_RIGHT {
                                width:  700px;
                                height: 30px;

                                background-image: url(vertical_Right.png);
                                background-repeat: repeat-y;
                        }
                        .BOTTOM_LEFT {
                                width:  150px;
                                height: 40px;

                                background-image: url(bottom_Left.png);
                                background-repeat: no-repeat;
                        }
                        .BOTTOM_RIGHT {
                                width:  700px;
                                height: 40px;

                                text-align: center;

                                background-image: url(bottom_Right.png);
                                background-repeat: no-repeat;
                        }

解决方案：

图片确实用于创建边框，这是不必要的，因为 CSS 已经为此目的提供了边框属性。因此，所有相关的图片都可以搁置并使用边框属性。同样，也可以使用border-left、right、top、bottom。

table {
    border: 2px solid red;
}

Answer 1

<table class="TOPIC_STYLE" align="left">

他们应该看起来像这样..你还遇到同样的问题吗？

Answer 2

不知道为什么你的班级名称前面有一个美元符号。尝试这个：

<table class="TOPIC_STYLE">

Answer 3

您的背景图像不够宽，无法在不重复的情况下覆盖所有空间。对于.TOP_LEFT，更改background-repeat:并repeat-x;编辑一个新的图像更高更宽。

但如果我站在你的立场上，我会把这种效果当作边界来处理。取下所有背景图像并添加以下规则：

table { border: 2px solid blue; border-collapse: collapse; }
tr { border: 2px solid blue; }