计数器增量未正确启动 [英] Counter Increment is not starting properly

查看：24
本文介绍了计数器增量未正确启动的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我遇到以下问题，我的计数器增量无法正常工作.

h4.heading_numberlist {边距顶部:12.0pt；边距右:0in;底边距:3.0pt；左边距:0in；分页后:避免；字体大小:12.0pt；字体系列:Arial"，无衬线；颜色:黑色;字体粗细:粗体；}h4.heading_numberlist::before {内容:计数器(列表编号，上字母)'.';}.话题 {计数器增量:列表编号；}

<h4 class="heading_normal">护理</h4>
<div class="topicnested3"><h4 class="heading_numberlist">服务</h4>

<div class="topicnested3"><h4 class="heading_numberlist">测试</h4>

<div class="topicnested3"><h4 class="heading_numberlist">编号</h4>

我已经尝试过 .topic >Heading_numberlist 但它不起作用

预期输出是:

关怀A. 服务B. 测试C. 号码

我需要忽略heading_normal"对于包含的列表并从订单开始.

解决方案

您需要省略第一个 topic 并从第二个开始递增，否则您将在第一次显示之前将计数器递增两次:

h4.heading_numberlist {边距顶部:12.0pt；边距右:0in;底边距:3.0pt；左边距:0in；分页后:避免；字体大小:12.0pt；字体系列:Arial"，无衬线；颜色:黑色;字体粗细:粗体；}h4.heading_numberlist::before {内容:计数器(列表编号，上字母)'.';}.topic:not(:first-child) {计数器增量:列表编号；}

<h4 class="heading_normal">护理</h4>
<div class="topicnested3"><h4 class="heading_numberlist">服务</h4>

<div class="topicnested3"><h4 class="heading_numberlist">测试</h4>

<div class="topicnested3"><h4 class="heading_numberlist">编号</h4>

I'm having the below issue that my counter increment are not working properly.

h4.heading_numberlist {
  margin-top: 12.0pt;
  margin-right: 0in;
  margin-bottom: 3.0pt;
  margin-left: 0in;
  page-break-after: avoid;
  font-size: 12.0pt;
  font-family: "Arial", sans-serif;
  color: black;
  font-weight: bold;
}

h4.heading_numberlist::before {
  content: counter(list-number, upper-alpha) '. '; 
}

.topic {
  counter-increment: list-number;
}

<div class="topic nested3">
<h4 class="heading_normal">Care</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Services</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Tests</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Number</h4>
</div>

I have tried with .topic > heading_numberlist but it's not working

Expected Output is to be:

Care
A. Services
B. Tests
C. Number

I need to neglect the "heading_normal" for the list included and starting from the order.

解决方案

You need to omit the first topic and increment from the second one otherwise you will increment the counter twice before the first display:

h4.heading_numberlist {
  margin-top: 12.0pt;
  margin-right: 0in;
  margin-bottom: 3.0pt;
  margin-left: 0in;
  page-break-after: avoid;
  font-size: 12.0pt;
  font-family: "Arial", sans-serif;
  color: black;
  font-weight: bold;
}

h4.heading_numberlist::before {
  content: counter(list-number, upper-alpha) '. '; 
}

.topic:not(:first-child) {
  counter-increment: list-number;
}

<div class="topic nested3">
<h4 class="heading_normal">Care</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Services</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Tests</h4>
</div>
<div class="topic nested3">
<h4 class="heading_numberlist">Number</h4>
</div>

这篇关于计数器增量未正确启动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆