0

我正在尝试解决我的 HTML+CSS 的问题，以删除块引用标记内的表格的缩进。此表后面还有一些文本应该缩进，所以我不能将表从 blockquote 标记中取出。

有什么建议么？

目前是这样的：

目前是这样的：

但我想删除表格的缩进，例如：

但我想删除表格的缩进 Like

这是我生成的 HTML 代码（我们系统中的用户正在使用 TinyMCE 生成报告，然后将其转换为 PDF）：

blockquote.numbered-contents::before {
    counter-increment: section;
    content: counters(section, ".") " ";
}
blockquote {
    font-weight: bold;
}
article {
    font-weight: normal;
}
<section>
  <blockquote class="numbered-contents" id="734">Health, safety and environment<article class="mceEditable">&nbsp;</article>
  <section class="mceNonEditable">
      <blockquote class="numbered-contents" data-parent_id="734" data-report_template_items_id="53" id="712">Monthly report:
          <article class="mceEditable">
              <table border="0" class=" tinymce-table-border-bw" width="100%">
                  <tbody>
                      <tr>
                          <td></td>
                          <td>Mngmnt</td>
                          <td>M&amp;E</td>
                          <td>Labour</td>
                          <td>Carpenters</td>
                          <td>S/C</td>
                          <td>Total</td>
                      </tr>
                      <tr>
                          <td>Average number of personnel on site</td>
                          <td>1</td>
                          <td>6</td>
                          <td>2</td>
                          <td>5</td>
                          <td>4</td>
                          <td>18</td>
                      </tr>
                      <tr>

                          <td>Reportable incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Lost time incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Minor NLT incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Near Miss</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                  </tbody>
              </table>
              <div>&nbsp;</div>
              <div>Number of Tool Box Talks in the month: 2</div>
              <div>&nbsp;</div>
              <div>H&amp;S Inspections: 1</div>
              <div>&nbsp;</div>
          </article>
      </blockquote>
  </section>
  </blockquote>
</section>

谢谢。

4

3 回答 3

1

您可以margin-left: (some negative value)在table内部article使用blockquote：

blockquote.numbered-contents::before {
    counter-increment: section;
    content: counters(section, ".") " ";
}
blockquote {
    font-weight: bold;
}
article {
    font-weight: normal;
}

blockquote article table {
    margin-left: -44px;
}
<section>
  <blockquote class="numbered-contents" id="734">Health, safety and environment<article class="mceEditable">&nbsp;</article>
  <section class="mceNonEditable">
      <blockquote class="numbered-contents" data-parent_id="734" data-report_template_items_id="53" id="712">Monthly report:
          <article class="mceEditable">
              <table border="0" class=" tinymce-table-border-bw" width="100%">
                  <tbody>
                      <tr>
                          <td></td>
                          <td>Mngmnt</td>
                          <td>M&amp;E</td>
                          <td>Labour</td>
                          <td>Carpenters</td>
                          <td>S/C</td>
                          <td>Total</td>
                      </tr>
                      <tr>
                          <td>Average number of personnel on site</td>
                          <td>1</td>
                          <td>6</td>
                          <td>2</td>
                          <td>5</td>
                          <td>4</td>
                          <td>18</td>
                      </tr>
                      <tr>

                          <td>Reportable incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Lost time incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Minor NLT incidents</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                      <tr>
                          <td>Near Miss</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                          <td>0</td>
                      </tr>
                  </tbody>
              </table>
              <div>&nbsp;</div>
              <div>Number of Tool Box Talks in the month: 2</div>
              <div>&nbsp;</div>
              <div>H&amp;S Inspections: 1</div>
              <div>&nbsp;</div>
          </article>
      </blockquote>
  </section>
  </blockquote>
</section>

您需要使用的值取决于浏览器blockquote在其默认样式表中使用的默认边距或填充。
如果您还为元素定义自己的边距或填充blockquote，然后将这些值的负总和用作table.

于 2019-07-29T10:03:21.933 回答
1

根据建议，尤其是彼得的建议，对我有用的解决方案是：

blockquote {
    margin-right: 0;
    margin-left: 40px;
    width: 100%;
}

main section blockquote section blockquote article.mceEditable table {
    margin-left: -40px !important;
}

main section blockquote section blockquote section blockquote 
article.mceEditable table {
    margin-left: -80px !important;
}

main>section>blockquote{
    display: table;
    width: 100%;
}
于 2019-07-29T11:55:32.167 回答
0

只需取出articlefrom blockquote。

<blockquote class="numbered-contents" id="734">Health, safety and environment<article class="mceEditable">&nbsp;</article>
<section class="mceNonEditable">
    <blockquote class="numbered-contents" data-parent_id="734" data-report_template_items_id="53" id="712">Monthly report:
        
    </blockquote>
  <article class="mceEditable">
            <table border="0" class=" tinymce-table-border-bw" width="100%">
                <tbody>
                    <tr>
                        <td></td>
                        <td>Mngmnt</td>
                        <td>M&amp;E</td>
                        <td>Labour</td>
                        <td>Carpenters</td>
                        <td>S/C</td>
                        <td>Total</td>
                    </tr>
                    <tr>
                        <td>Average number of personnel on site</td>
                        <td>1</td>
                        <td>6</td>
                        <td>2</td>
                        <td>5</td>
                        <td>4</td>
                        <td>18</td>
                    </tr>
                    <tr>

                        <td>Reportable incidents</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                    </tr>
                    <tr>
                        <td>Lost time incidents</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                    </tr>
                    <tr>
                        <td>Minor NLT incidents</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                    </tr>
                    <tr>
                        <td>Near Miss</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                        <td>0</td>
                    </tr>
                </tbody>
            </table>
            
            <blockquote class="numbered-contents">Monthly report:
        <div>&nbsp;</div>
            <div>Number of Tool Box Talks in the month: 2</div>
            <div>&nbsp;</div>
            <div>H&amp;S Inspections: 1</div>
            <div>&nbsp;</div>
    </blockquote>
    
            
        </article>
</section>
</blockquote>

于 2019-07-29T09:01:24.437 回答