Bí quyết đánh số trong css theme flatsome wordpress

• INFO

một số trang kiểu dáng cần đánh số , mà việc custom đánh số rất mấy thời gian chưa nói sau này thêm bớt dự liệu phải nhập lại những Báo cáo này, để khác phục việc đánh số trên hôm nay mình share cho anh em bí quyết đánh số trong css theme flatsome wordpress hoàn toàn tự động bằng css nhé, Đọc hết bài vững chắc bạn sẽ làm theo được nhé

bí quyết đánh số trong css theme flatsome wordpress

phương pháp đánh số trong css theme flatsome wordpress

Như hình bạn thấy những số được đánh trong khoảng một – > 8 hoàn toàn tự động theo list ( ul li trong css )

sở hữu THỂ BẠN quan tâm

• AZDIGI bật mí deal bí mật, giảm 90% Hosting
• hướng dẫn tích hợp Zalo Chat vào website wordpress
• các đoạn code file function.php hay sử dụng và rất có ích ( cập nhật thường xuyên )
• Hiệu ứng chuyển màu (Gradient) với CSS3
• Plugin chế độ xem sản phẩm List View và Grid trong WooCommerce
• Code bài viết cùng chuyên mục kèm hình ảnh (thumbnai) cho WordPress

bí quyết làm như sau , ở trình soạn dự liệu bạn nhập dự liệu sau đó chọn dự liệu qua list như hình

phương pháp đánh số trong css theme flatsome wordpress – chọn dự liệu thành list

sau đấy chọn css sau vào custom của theme đang tiêu dùng

<br /> /* Count List - Flatsome.xyz */<br /> .rightthicong ul li, .leftthicong ul li <br /> list-style: none;<br /> counter-increment: h3;<br /> display: list-item;<br /> line-height: một.5;<br /> padding: 7px;<br /> <br /> .rightthicong ul li:before <br /> display: list-item;<br /> content: "0" counter(h3) " ";<br /> color: lightsalmon;<br /> font-weight: bold;<br /> position: absolute;<br /> margin-left: -40px;<br /> border: 2px solid #fea8856e;<br /> border-radius: 99px;<br /> padding: 2px 5px;<br /> <br /> .leftthicong ul li:before <br /> display: list-item;<br /> content: "0" counter(h3) " ";<br /> color: lightsalmon;<br /> font-weight: bold;<br /> position: absolute;<br /> margin-left: 95%;<br /> border: 2px solid #fea8856e;<br /> border-radius: 99px;<br /> padding: 2px 5px;<br />

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

/* Count List - Flatsome.xyz */ .rightthicong ul li, .leftthicong ul li list-style: none; counter-increment: h3; display: list-item; line-height: một.5; padding: 7px; .rightthicong ul li:before display: list-item; content: "0" counter(h3) " "; color: lightsalmon; font-weight: bold; position: absolute; margin-left: -40px; border: 2px solid #fea8856e; border-radius: 99px; padding: 2px 5px; .leftthicong ul li:before display: list-item; content: "0" counter(h3) " "; color: lightsalmon; font-weight: bold; position: absolute; margin-left: 95%; border: 2px solid #fea8856e; border-radius: 99px; padding: 2px 5px;

Note : hai class .rightthicong và .leftthicong là class đặt cho hai bảng ( table ) chưa text nhé – để css cho nằm bên trái và bên phải , bạn có thể đặt khác nhé

Dong này content: “0” counter(h3) ” “; sẽ đếm dự liệu và chèn số 0 và trước số count được bạn nhé , bạn sở hữu thể thay đổi theo ý của bạn

Sau lúc bạn chèn css thì số sẽ tự động chạy , sau này bạn thêm 1 loại ( list bên dưới ) số thứ tự sẽ thành max + một nhé

OK vậy là xong , ví như khiến cho không được hoặc với vấn đề gì liên hệ tớ – Chúc bạn thành công !

bạn với thể Nhận định sâu hơn về count trong css tại đây https://www.positioniseverything.net/css-counter