格式化像Word文档

Question

我正在为公司的内部网网站重新创建一堆Word文档到网页中。我试图找到一种更好的方法来简化格式化，而不是。 这是它目前在网页上的样子： 我需要它看起来与我一样，因为我可以得到文本都在每行下面格式化而不是回到数字下面：

这是一个小片段：

＆＃13;

＆＃13;

.secthead {
  font-weight: bold;
  font-size: 16px;
  padding-bottom: 5px;
  padding-top: 15px;
  text-decoration: underline;
  padding-left: 25px;
}

dt {
  font-weight: bold;
  font-size: 16px;
  padding-bottom: 5px;
  padding-top: 15px;
}

dd {
  padding: 5px 5px 5px 15px;
}

.sub {
  padding-left: 10px;
}

.def {
  padding-left: 50px;
}

＆＃13;

<dl>
  <dt>6.0 <span class="secthead">PROCEDURE:</span></dt>
  <dd><span class="sub">6.4</span><span class="def">General tasks carried out by personnel involved primarily in Payroll functions are addressed in the Miscellaneous Payroll Functions Work Instruction. Typical functions addressed in this work instruction are as follows:
  <ul>
  <li>Employment Verifications </li>
  <li>New Hire reporting</li>
  <li>Payroll Bank Reconciliations</li>
  </ul>
  </span></dd>
</dl>

＆＃13;

＆＃13;

＆＃13;

Answer 1

强制您的号码转到左侧，并阻止您的内容。然后对齐您的列表＆＃39;最后两条规则的子弹。

＆＃13;

＆＃13;

.secthead {
  font-weight: bold;
  font-size: 16px;
  padding-bottom: 5px;
  padding-top: 15px;
  text-decoration: underline;
  padding-left: 25px;
}

dt {
  font-weight: bold;
  font-size: 16px;
  padding-bottom: 5px;
  padding-top: 15px;
}

dd {
  padding: 5px 5px 5px 0px;
  margin: 0px 
}

.sub {
  float: left; 
}

.def {
  padding-left: 50px;
  display: block; 
}

ul  {
  padding-left:0;   
}
ul li  {
  list-style-position:inside
}

＆＃13;

<dl>
  <dt>6.0 <span class="secthead">PROCEDURE:</span></dt>
  <dd><span class="sub">6.4</span><span class="def">General tasks carried out by personnel involved primarily in Payroll functions are addressed in the Miscellaneous Payroll Functions Work Instruction. Typical functions addressed in this work instruction are as follows:
  <ul>
  <li>Employment Verifications </li>
  <li>New Hire reporting</li>
  <li>Payroll Bank Reconciliations</li>
  </ul>
  </span></dd>
</dl>

＆＃13;

＆＃13;

＆＃13;