Question

我有两个电话号码标记为列表。我需要在第一个前缀加上＆＃34; Foo：＆＃34;第二个用＆＃34; Bar：＆＃34;。我可以实现＆＃34; Foo：＆＃34;但不是＆＃34; Bar：＆＃34;。根据以下代码，我如何实现＆＃34; Bar：＆＃34;？

＆＃13;

BufferedReader

＆＃13;

lines()

＆＃13;

Answer 1

你试过:nth-child(n)吗？解决这类问题非常有帮助：

＆＃13;

#top_bar .phone:nth-child(1) .icon-phone:after{
  content: 'Foo:';
}
#top_bar .phone:nth-child(2) .icon-phone:after {
  content: 'Bar:';
}

＆＃13;

<div id="top_bar">
  <ul class="contact_details">
    <li class="phone">
      <i class="icon-phone"></i><a href="tel:00001">00001</a>
    </li>
    <li class="phone">
      <i class="icon-phone"></i><a href="tel:00002">00002</a>
    </li>
    <li class="mail">
      <i class="icon-mail "></i><a href="mailto:foo@bar.com ">foo@bar.com</a>
    </li>
  </ul>
</div>

＆＃13;

Answer 2

.phone:nth-child(1):before  { content: 'Foo:'; font-style: italic; }
.phone:nth-child(2):before  { content: 'Bar:'; font-style: italic; }

DEMO

使用：after：：CSS中的last-child

2 个答案: