您好,我使用 css 和 html5 创建了一个单选按钮 Accordion ,我遇到的问题是 section 元素的伪类无法正确显示其内容,例如 content: '1' 和 content: ' 3' 为他们的部分面板。我创建了一个 codepen有人可以看看他们是否可以让数字位于面板底部并显示所有相应的数字。我一直在关注这个 tutorial
&:nth-child(1):after { content: '1'; } // doesn't show
&:nth-child(2):after { content: '2'; } // can't get it to line up
&:nth-child(3):after { content: '3'; } // doesn't show
&:nth-child(4):after { content: '4'; } // can't get it to line up
最佳答案
你有 <label>
被视为 <section>
子元素的元素元素并添加到计数中。
因此,为了补偿额外的标签元素,将您的子选择器更改为偶数。
&:nth-child(2):after { content: '1'; }
&:nth-child(4):after { content: '2'; }
&:nth-child(6):after { content: '3'; }
&:nth-child(8):after { content: '4'; }
关于html - 伪类内容未正确显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29860489/