Tự động đánh số thứ tự cho Nhận Xét có phân cấp của Blogspot chỉ bằng CSS

Bài viết hướng dẫn mọi người đánh số thứ tự cho nhận xét blogspot có phân cấp chỉ bằng CSS

Hướng dẫn

Xác định class của khung chứa phần Nhận xét

Phần khung chứa Nhận xét thường có dạng như sau <div class="comment-thread toplevel-thread"></div>
Như vậy ta xác định được class sẽ là comment-thread và toplevel-thread, và ta chọn 1 trong số các class của thẻ này để gắn hiển thị đánh số thứ tự cho các thẻ li trong đó

CSS

.comment-thread ol  {
    counter-reset: section 0;
}
.comment-thread ol li  {
    counter-increment: section;
}
.comment-thread ol li::before  {
    content: counters(section, ".") " ";
    border-radius: 10px;
    border: 1px solid #ddd;
    padding: 3px 5px;
    background: #f9f9f9;
    position: absolute;
    z-index: 999;
    margin-top: -9px;
    margin-left: 30px;
}

Vậy là xong, giờ các nhận xét tự động đánh số theo phân cấp dù bạn có đẻ bao nhiêu cấp cho Nhận Xét của bạn đi nữa.

Demo tại khung bình luận ở bài viết này.

Theo BlogspotVN.Net