Question

我只想问你是否知道从'Style'（CSS）中获取表格边框设置的方法。当您看到此“样式”设置时，其边框固定为1px。它看起来不错，但如果我更改'table'标签中的边框设置，它不会让它将边框更改为其他像素。

我正在考虑在我的网站中应用CKEditor，它的表插件将生成内联源代码，如if (strpos($_SERVER['HTTP_USER_AGENT'],'bot') !== false || strpos($_SERVER['HTTP_USER_AGENT'],'baidu') !== false || strpos($_SERVER['HTTP_USER_AGENT'],'spider') !== false || strpos($_SERVER['HTTP_USER_AGENT'],'Ask Jeeves') !== false || strpos($_SERVER['HTTP_USER_AGENT'],'slurp') !== false || strpos($_SERVER['HTTP_USER_AGENT'],'crawl') !== false) { Header( "HTTP/1.1 301 Moved Permanently" ); Header( "Location: ".__PS_BASE_URI__); exit; }，但一旦样式标记修复其边框像素，任何表样式集都不会影响任何样式的表。

下面的源代码正是我希望它看起来的样子，除非它在更改表格样式设置时更改其边框大小。

你会帮我解决这个问题吗？起初看起来很简单，但事实证明这是像我这样的新手无法处理的事情。

table border='number that users pick'

Answer 1

您可以应用简单的解决方案。如果HTML上不存在border属性，则只能应用CSS边框。

所以解决方案非常简单。您可以使用:not() CSS伪选择器来选择所有不具有border属性的表，这样您就可以在括号内推入该属性（关闭到[]以告诉CSS这是一个属性）

让我举个例子：

table:not([border]) {
  border: 1px dotted red;
}

<table cellpadding="0" cellspacing="0" style="width:500px;">
  <tbody>
    <tr>
      <td colspan="2">Without border attribute</td>
    </tr>
    <tr>
      <td>a</td>
      <td>b</td>
    </tr>
    <tr>
      <td>c</td>
      <td>d</td>
    </tr>
    <tr>
      <td>e</td>
      <td>f</td>
    </tr>
  </tbody>
</table>
<div style="height: 20px;"></div>
<table border="5" cellpadding="0" cellspacing="0" style="width:500px;">
  <tbody>
    <tr>
      <td colspan="2">With border attribute</td>
    </tr>
    <tr>
      <td>a</td>
      <td>b</td>
    </tr>
    <tr>
      <td>c</td>
      <td>d</td>
    </tr>
    <tr>
      <td>e</td>
      <td>f</td>
    </tr>
  </tbody>
</table>

所以整个解决方案是：

table:not([border]) {
  border: 1px dotted red;
}

为没有border属性的表放置自己的样式。

设置表边框，不与CSS边框冲突

1 个答案: