html - 怎么把一里分成三等份

Question

我想分成3个部分。

<li>
<font size="1">
   <div>${comment.postingDate}</div>
   <div><a href="javascript:void(0)" class="like">Like</a><a href="javascript:void(0)" style="padding-left:6px;" class="love">Love</a></div> 
   <div><span class="badge"><i class="icon-thumbs-up"></i><span class="like-count">1</span></span>
        <span class="badge badge-important"><i class="icon-heart"></i><span class="love-count">1</span></span>
   </div>
 </font>
</li>

但我认为这是错误的设计。我是 html 新手，所以想知道如何有效地实现这一目标。

注释的最后一行必须看起来像

像爱一样的日期在这里应该用计数签名。

Answer 1

根据我的观察，您正在寻找 Image 中的最后一行。

删除字体标签

<div class="col">${comment.postingDate}</div>
<div class="col">
     <a href="javascript:void(0)" class="like">Like</a><a href="javascript:void(0)" style="padding-left:6px;" class="love">Love</a>
</div> 
<div class="col">
    <span class="badge"><i class="icon-thumbs-up"></i><span class="like-count">1</span></span>
    <span class="badge badge-important"><i class="icon-heart"></i><span class="love-count">1</span></span>
</div>

有风格

.col{position:relative;float:left;top:0}

我认为这会做

Answer 2

我想我得到了我想要的东西。

              <li>
                            <font size="1">
                               <span>${comment.postingDate}</span>
                               <span>
                                  <a href="javascript:void(0)" class="like">Like</a>
                                  <a href="javascript:void(0)" style="padding-left:6px;" class="love">Love</a></span> 
                               <span class="pull-right">
                                  <span class="badge"><i class="icon-thumbs-up"></i><span class="like-count">1</span></span>
                                  <span class="badge badge-important"><i class="icon-heart"></i><span class="love-count">1</span></span>
                               </span>
                             </font>
                            </li>