Cara Membuat Nomor yang Cantik pada Postingan Blog

Hallo Semua! Selamat malam sahabat onnews.my.id.

Seperti yang kita ketahui bersama, membuat postingan blog dengan tampilan cantik dan menarik akan sering disukai pengnjung.

© onnews | Cara Membuat Nomor yang Cantik pada Postingan Blog

Pada kesempatan ini, admin akan membahas tentang Cara Membuat Nomor yang Cantik pada Postingan Blog

Langkah 1: Pertama silahkan Login pada blog kamu Blogger Dashboard.

Langkah 2: pada Blogger Dashboard, Silahkan Theme.

Langkah 3: Kliklah icon seperti gambar disamping Kemudian Pilih 'customize' button.

Langkah 4: klik Edit HTML, kamu akan diarahkan ke halaman penyuntingan.

Langkah 5: Sekarang carilah code berikut ini ]]></b:skin> dan paste CSS di atas code tersebut.

Baca Juga :

ol.style1{counter-reset:numbers;list-style:none;padding:0}ol.style1>li{counter-increment:numbers;margin-bottom:25px;position:relative;margin-left:55px}ol.style1>li img{margin:15px 0;width:100%;display:block}ol.style1>li #box-download img{margin:0}ol.style1>li::before{content:counter(numbers);line-height:23px;font-family:'Noto Sans',sans-serif;font-size:14px;font-weight:700;left:-45px;width:32px;height:32px;text-align:center;position:absolute;color:#eb3b5a;border:5px solid rgba(42,203,186,1);border-radius:50px;top:-2px}ol.standard li,ol.style0 li,ol.style1 li ul li,ol.style2 li{margin-bottom:15px}ol.style1 li ul{margin-top:15px}.drK ol.style1>li::before{color:#7efff5;border-color:rgba(50,255,126,1)}

ol.style2{counter-reset:numbers;list-style:none;padding:0}ol.style2>li{counter-increment:numbers;margin-bottom:25px;position:relative;margin-left:55px}ol.style2>li img{margin:15px 0;width:100%;display:block}ol.style2>li::before{content:counter(numbers);line-height:23px;font-family:'var(--fontB)';font-size:14px;font-weight:700;left:-45px;width:32px;height:32px;text-align:center;position:absolute;color:#9c27b0;border:5px solid rgb(254 202 87);border-radius:50% 0 50% 50%;top:-2px}ol.style2 li ul li{margin-bottom:15px}ol.style2 li ul{margin-top:15px}.drK ol.style2>li::before{color:#fff200;border-color:rgba(24,220,255,1)}

HTML For Style 1

<ol class="style1">
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li></ol>

HTML For Style 2

<ol class="style2">
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li>
<li> Nomor yang Cantik pada Postingan </li></ol>

1. Nomor yang Cantik pada Postingan
2. Nomor yang Cantik pada Postingan

1. Nomor yang Cantik pada Postingan
2. Nomor yang Cantik pada Postingan