僞類的使用之如何在一段文字前面添加一個點

示例

HTML內容：

<div class="sub-cell">

　　<p>　　

1.table是個好東西，若是你想使圖片和文字對齊，用table的<td>標籤控制，能夠使他們保持對齊。

2.table還能解決浮動的居中對齊問題，其實咱們用float的話會出現至關多的問題，大多數時候，我以爲能夠用table來取代float來控制向右對齊，向左對齊的　　　　問題。

3.其實表單的對齊用table來控制 ，十分方便。有的時候不一樣的樣式用同一種代碼是沒法解決的，你能夠用width=「100%」或者width=「50px」等不一樣的方式去試試，也許就能解決。

以上是我在作項目時本身的總結，若有不對，歡迎你們指正，也能夠補充哦。

　　</p>

</div>

less內容：

<style>
    .sub-cell {
      background-color: #f7f7f7;
    . px2rem(font-size, 24);
    . px2rem(line-height, 36);
    . px2rem(padding-top, 24);
    . px2rem(padding-right, 40);
    . px2rem(padding-bottom, 32);
    . px2rem(padding-left, 50);
    }
</style>

用僞類插入一個點後less代碼()：

    .sub-cell p{
      background-color: #f7f7f7;
      .px2rem(font-size, 24);
      .px2rem(line-height, 36);
      .px2rem(padding-top,24);
      .px2rem(padding-right, 40);
      .px2rem(padding-bottom, 32);
      .px2rem(padding-left, 50);
      position: relative;
      &::before{
        content :counter(sub-item,disc);
        display: block;
        position: absolute;
        .px2rem(left, 30);
        .px2rem(top, 20);
      }
    }

先後對比會發如今文字前面加了一個點。