页面中断后没有工作

时间：2016-12-22 15:33:42

标签： css page-break

我尝试避免多个div标题的分页（使用drupal），但是page-break-after：避免什么都不做（但是page-break-before：总是这样）。不是空的，所以它应该工作。任何提示？我的代码html是：

＆＃13;
＆＃13; 
#DIV_1 {
  height: 279px;
  width: 875px;
  perspective-origin: 437.5px 139.5px;
  transform-origin: 437.5px 139.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#DIV_1*/

#DIV_2 {
  height: 28px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 14px;
  transform-origin: 437.5px 14px;
  font: normal normal bold normal 24px / normal helvetica, arial;
}
/*#DIV_2*/

#DIV_3 {
  height: 251px;
  width: 875px;
  perspective-origin: 437.5px 125.5px;
  transform-origin: 437.5px 125.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 10px;
}
/*#DIV_3*/

#DIV_4 {
  height: 141px;
  width: 875px;
  perspective-origin: 437.5px 70.5px;
  transform-origin: 437.5px 70.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#DIV_4*/

#DIV_5 {
  break-after: avoid;
  height: 23px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 11.5px;
  transform-origin: 437.5px 11.5px;
  font: italic normal normal normal 20.4px / normal helvetica, arial;
  margin: 0px 0px 5px;
}
/*#DIV_5, #DIV_50*/

#DIV_6 {
  height: 113px;
  width: 875px;
  perspective-origin: 437.5px 56.5px;
  transform-origin: 437.5px 56.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 10px;
}
/*#DIV_6*/

#TABLE_7 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 112px;
  width: 875px;
  perspective-origin: 437.5px 56.5px;
  transform-origin: 437.5px 56.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 15px;
}
/*#TABLE_7*/

#CAPTION_8 {
  border-collapse: collapse;
  height: 21px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 10.5px;
  transform-origin: 437.5px 10.5px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 18px / normal helvetica, arial;
}
/*#CAPTION_8, #CAPTION_53*/

#THEAD_9 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 22px;
  width: 875px;
  perspective-origin: 437.5px 11px;
  transform-origin: 437.5px 11px;
  border: 0px none rgb(128, 128, 128);
  border-spacing: 2px 2px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#THEAD_9, #THEAD_54*/

#TR_10 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 22px;
  vertical-align: middle;
  width: 875px;
  perspective-origin: 437.5px 11px;
  transform-origin: 437.5px 11px;
  background: rgba(0, 0, 0, 0) linear-gradient(rgb(218, 241, 255) 0%, rgb(175, 232, 255) 100%) repeat scroll 0% 0% / auto padding-box border-box;
  border: 0px none rgb(128, 128, 128);
  border-spacing: 2px 2px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#TR_10, #TR_55*/

#TH_11 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 72px;
  perspective-origin: 43px 11px;
  transform-origin: 43px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_11, #TH_12, #TH_56*/

#TH_13 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 197px;
  perspective-origin: 105.5px 11px;
  transform-origin: 105.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_13, #TH_58*/

#TH_14 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 110px;
  perspective-origin: 62px 11px;
  transform-origin: 62px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_14, #TH_59*/

#TH_15 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 165px;
  perspective-origin: 89.5px 11px;
  transform-origin: 89.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_15, #TH_60*/

#TH_16 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 77px;
  perspective-origin: 45.5px 11px;
  transform-origin: 45.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_16, #TH_61*/

#TH_17 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 84px;
  perspective-origin: 49px 11px;
  transform-origin: 49px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_17, #TH_62*/
＆＃13; 
<div id="DIV_1">
  <div id="DIV_2">
    Anoia
  </div>
  <div id="DIV_3">
    <div id="DIV_4">
      <div id="DIV_5">
        Sant Martí de Tous
      </div>
      <div id="DIV_6">
        <table id="TABLE_7">
          <caption id="CAPTION_8">
            Can Aubareda
          </caption>
          <thead id="THEAD_9">
            <tr id="TR_10">
              <th id="TH_11">
                Data inici
              </th>
              <th id="TH_12">
                Data fi
              </th>
              <th id="TH_13">
                Entitat
              </th>
              <th id="TH_14">
                Municipi
              </th>
              <th id="TH_15">
                Contacte
              </th>
              <th id="TH_16">
                Telèfon
              </th>
              <th id="TH_17">
                Persones
              </th>
            </tr>
          </thead>
        </table>
      </div>
    </div>
  </div>
</div>
＆＃13;
＆＃13;
＆＃13;

3 个答案:

答案 0 :(得分：0)

将div更改为span是不可接受的？

答案 1 :(得分：0)

尝试添加#DIV_2 {display: inline}但最好使用相应的html元素，如果div替换span是更好的解决方案，因为div是一个block element。

答案 2 :(得分：0)

在display: inline;，#DIV_2，#DIV_3，#DIV_4中使用#DIV_5，使Anoia Sant Martí de Tous位于同一行

在同一行中获取Can Aubareda的

对#DIV_6，table，caption使用相同的内容。 但我不推荐你，因为你不应该table显示为inline 

#DIV_1 {
  height: 279px;
  width: 875px;
  perspective-origin: 437.5px 139.5px;
  transform-origin: 437.5px 139.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#DIV_1*/

#DIV_2 {
    display: inline;
  height: 28px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 14px;
  transform-origin: 437.5px 14px;
  font: normal normal bold normal 24px / normal helvetica, arial;
}
/*#DIV_2*/

#DIV_3 {
    display: inline;
  height: 251px;
  width: 875px;
  perspective-origin: 437.5px 125.5px;
  transform-origin: 437.5px 125.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 10px;
}
/*#DIV_3*/

#DIV_4 {
    display: inline;
  height: 141px;
  width: 875px;
  perspective-origin: 437.5px 70.5px;
  transform-origin: 437.5px 70.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#DIV_4*/

#DIV_5 {
    display: inline;
  break-after: avoid;
  height: 23px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 11.5px;
  transform-origin: 437.5px 11.5px;
  font: italic normal normal normal 20.4px / normal helvetica, arial;
  margin: 0px 0px 5px;
}
/*#DIV_5, #DIV_50*/

#DIV_6 {
  height: 113px;
  width: 875px;
  perspective-origin: 437.5px 56.5px;
  transform-origin: 437.5px 56.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 10px;
}
/*#DIV_6*/

#TABLE_7 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 112px;
  width: 875px;
  perspective-origin: 437.5px 56.5px;
  transform-origin: 437.5px 56.5px;
  font: normal normal normal normal 12px / normal helvetica, arial;
  margin: 0px 0px 15px;
}
/*#TABLE_7*/

#CAPTION_8 {
  border-collapse: collapse;
  height: 21px;
  text-align: left;
  width: 875px;
  perspective-origin: 437.5px 10.5px;
  transform-origin: 437.5px 10.5px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 18px / normal helvetica, arial;
}
/*#CAPTION_8, #CAPTION_53*/

#THEAD_9 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 22px;
  width: 875px;
  perspective-origin: 437.5px 11px;
  transform-origin: 437.5px 11px;
  border: 0px none rgb(128, 128, 128);
  border-spacing: 2px 2px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#THEAD_9, #THEAD_54*/

#TR_10 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 22px;
  vertical-align: middle;
  width: 875px;
  perspective-origin: 437.5px 11px;
  transform-origin: 437.5px 11px;
  background: rgba(0, 0, 0, 0) linear-gradient(rgb(218, 241, 255) 0%, rgb(175, 232, 255) 100%) repeat scroll 0% 0% / auto padding-box border-box;
  border: 0px none rgb(128, 128, 128);
  border-spacing: 2px 2px;
  font: normal normal normal normal 12px / normal helvetica, arial;
}
/*#TR_10, #TR_55*/

#TH_11 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 72px;
  perspective-origin: 43px 11px;
  transform-origin: 43px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_11, #TH_12, #TH_56*/

#TH_13 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 197px;
  perspective-origin: 105.5px 11px;
  transform-origin: 105.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_13, #TH_58*/

#TH_14 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 110px;
  perspective-origin: 62px 11px;
  transform-origin: 62px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_14, #TH_59*/

#TH_15 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 165px;
  perspective-origin: 89.5px 11px;
  transform-origin: 89.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_15, #TH_60*/

#TH_16 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 77px;
  perspective-origin: 45.5px 11px;
  transform-origin: 45.5px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_16, #TH_61*/

#TH_17 {
  border-collapse: collapse;
  break-inside: avoid;
  height: 14px;
  text-align: left;
  vertical-align: middle;
  width: 84px;
  perspective-origin: 49px 11px;
  transform-origin: 49px 11px;
  border-spacing: 2px 2px;
  font: normal normal bold normal 12px / normal helvetica, arial;
  padding: 4px 7px;
}
/*#TH_17, #TH_62*/
<div id="DIV_1">
  <div id="DIV_2">
    Anoia
  </div>
  <div id="DIV_3">
    <div id="DIV_4">
      <div id="DIV_5">
        Sant Martí de Tous
      </div>
      <div id="DIV_6">
        <table id="TABLE_7">
          <caption id="CAPTION_8">
            Can Aubareda
          </caption>
          <thead id="THEAD_9">
            <tr id="TR_10">
              <th id="TH_11">
                Data inici
              </th>
              <th id="TH_12">
                Data fi
              </th>
              <th id="TH_13">
                Entitat
              </th>
              <th id="TH_14">
                Municipi
              </th>
              <th id="TH_15">
                Contacte
              </th>
              <th id="TH_16">
                Telèfon
              </th>
              <th id="TH_17">
                Persones
              </th>
            </tr>
          </thead>
        </table>
      </div>
    </div>
  </div>
</div>

相关问题
最新问题