Creative-Blog

Eski paylaşım arşivimizden toz tutmuş bir paylaşım yeniden sizlerle. Bir aralar "Blog kutusu, Duyuru panosu, İntro, Sayfa numaralandırma vs." gibi grafik işlerinin hepsinde aynı renk tonlarını kullanarak bir çok paylaşım yapmıştım. Yapıldığı zamanlarda çoğuda oldukça tutmuştu. Bir ziyaretçimizin "Sayfa Numaralandırma" ile ilgili bir mesajı üzerine arşivimizden toz tutmuş sayfa numaralandırma kodları sizlerle. İsteyen arkadaşlar kodları kendi sitesinin rengine göre değiştirip kullanabilirler...

Not: Gözükmesinin istediğiniz kodun isminin üzerine geliniz.   

Sayfa Numaralandırma Gri

1 2 3 4 5 6 7 8 9 10

< Önceki Sonraki >

<style type="text/css"> #grinumara { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaragritb.png); height: 77px; width: 500px; margin-right: auto; margin-left: auto; } #grinumara ul { list-style-type: none; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 17px; } #grinumara ul li { float: left; width: 38px; margin-right: 7px; } #grinumara ul li a { height: 30px; width: 38px; text-align: center; display: block; color: #3E3C3C; font-family: Tahoma; font-size: 18px; text-decoration: none; margin-top: 18px; line-height: 30px; } #grinumara ul li a:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaragrihv.png); height: 39px; width: 38px; margin-top: 11px; } #grigeri { float: left; margin-top: 3px; position: relative; width: 75px; } #grigeri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #3E3C3C; } #grigeri a:hover { color: #CCC; } #griileri { float: right; margin-top: 3px; position: relative; width: 75px; } #griileri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #3E3C3C; } #griileri a:hover { color: #CCC; } </style> <div id="grinumara"> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" valign="top"> <ul> <li><a href="#" _fcksavedurl="#">1</a></li> <li><a href="#" _fcksavedurl="#">2</a></li> <li><a href="#" _fcksavedurl="#">3</a></li> <li><a href="#" _fcksavedurl="#">4</a></li> <li><a href="#" _fcksavedurl="#">5</a></li> <li><a href="#" _fcksavedurl="#">6</a></li> <li><a href="#" _fcksavedurl="#">7</a></li> <li><a href="#" _fcksavedurl="#">8</a></li> <li><a href="#" _fcksavedurl="#">9</a></li> <li><a href="#" _fcksavedurl="#">10 </a></li> </ul> </td> </tr> <tr> <td><div id="grigeri"><a href="#" _fcksavedurl="#">< Önceki</a></div> <div id="griileri"><a href="#" _fcksavedurl="#">Sonraki ></a></div></td> </tr> </table> </div>

Sayfa Numaralandırma Kahverengi

1 2 3 4 5 6 7 8 9 10

< Önceki Sonraki >

<style type="text/css"> #kahvenumara { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numarakahvetb.png); height: 77px; width: 500px; margin-right: auto; margin-left: auto; } #kahvenumara ul { list-style-type: none; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 17px; } #kahvenumara ul li { float: left; width: 38px; margin-right: 7px; } #kahvenumara ul li a { height: 30px; width: 38px; text-align: center; display: block; color: #6C4929; font-family: Tahoma; font-size: 18px; text-decoration: none; margin-top: 18px; line-height: 30px; } #kahvenumara ul li a:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numarakahvehv.png); height: 39px; width: 38px; margin-top: 11px; } #kahvegeri { float: left; margin-top: 3px; position: relative; width: 75px; } #kahvegeri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #6C4929; } #kahvegeri a:hover { color: #553920; } #kahveileri { float: right; margin-top: 3px; position: relative; width: 75px; } #kahveileri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #6C4929; } #kahveileri a:hover { color: #553920; } </style> <div id="kahvenumara"> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" valign="top"> <ul> <li><a href="#" _fcksavedurl="#">1</a></li> <li><a href="#" _fcksavedurl="#">2</a></li> <li><a href="#" _fcksavedurl="#">3</a></li> <li><a href="#" _fcksavedurl="#">4</a></li> <li><a href="#" _fcksavedurl="#">5</a></li> <li><a href="#" _fcksavedurl="#">6</a></li> <li><a href="#" _fcksavedurl="#">7</a></li> <li><a href="#" _fcksavedurl="#">8</a></li> <li><a href="#" _fcksavedurl="#">9</a></li> <li><a href="#" _fcksavedurl="#">10 </a></li> </ul> </td> </tr> <tr> <td><div id="kahvegeri"><a href="#" _fcksavedurl="#">< Önceki</a></div> <div id="kahveileri"><a href="#" _fcksavedurl="#">Sonraki ></a></div></td> </tr> </table> </div>

Sayfa Numaralandırma Mavi

1 2 3 4 5 6 7 8 9 10

< Önceki Sonraki >

<style type="text/css"> #mavinumara { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaramavitb.png); height: 77px; width: 500px; margin-right: auto; margin-left: auto; } #mavinumara ul { list-style-type: none; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 17px; } #mavinumara ul li { float: left; width: 38px; margin-right: 7px; } #mavinumara ul li a { height: 30px; width: 38px; text-align: center; display: block; color: #354F6A; font-family: Tahoma; font-size: 18px; text-decoration: none; margin-top: 18px; line-height: 30px; } #mavinumara ul li a:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaramavihv.png); height: 39px; width: 38px; margin-top: 11px; } #mavigeri { float: left; margin-top: 3px; position: relative; width: 75px; } #mavigeri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #354F6A; } #mavigeri a:hover { color: #fff; } #maviileri { float: right; margin-top: 3px; position: relative; width: 75px; } #maviileri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #354F6A; } #maviileri a:hover { color: #fff; } </style> <div id="mavinumara"> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" valign="top"> <ul> <li><a href="#" _fcksavedurl="#">1</a></li> <li><a href="#" _fcksavedurl="#">2</a></li> <li><a href="#" _fcksavedurl="#">3</a></li> <li><a href="#" _fcksavedurl="#">4</a></li> <li><a href="#" _fcksavedurl="#">5</a></li> <li><a href="#" _fcksavedurl="#">6</a></li> <li><a href="#" _fcksavedurl="#">7</a></li> <li><a href="#" _fcksavedurl="#">8</a></li> <li><a href="#" _fcksavedurl="#">9</a></li> <li><a href="#" _fcksavedurl="#">10 </a></li> </ul> </td> </tr> <tr> <td><div id="mavigeri"><a href="#" _fcksavedurl="#">< Önceki</a></div> <div id="maviileri"><a href="#" _fcksavedurl="#">Sonraki ></a></div></td> </tr> </table> </div>

Sayfa Numaralandırma Yeşil

1 2 3 4 5 6 7 8 9 10

< Önceki Sonraki >

<style type="text/css"> #yesilnumara { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numarayesiltb.png); height: 77px; width: 500px; margin-right: auto; margin-left: auto; } #yesilnumara ul { list-style-type: none; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 17px; } #yesilnumara ul li { float: left; width: 38px; margin-right: 7px; } #yesilnumara ul li a { height: 30px; width: 38px; text-align: center; display: block; color: #3E600F; font-family: Tahoma; font-size: 18px; text-decoration: none; margin-top: 18px; line-height: 30px; } #yesilnumara ul li a:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numarayesilhv.png); height: 39px; width: 38px; margin-top: 11px; } #yesilgeri { float: left; margin-top: 3px; position: relative; width: 75px; } #yesilgeri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #3E600F; } #yesilgeri a:hover { color: #fff; } #yesilileri { float: right; margin-top: 3px; position: relative; width: 75px; } #yesilileri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #3E600F; } #yesilileri a:hover { color: #fff; } </style> <div id="yesilnumara"> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" valign="top"> <ul> <li><a href="#" _fcksavedurl="#">1</a></li> <li><a href="#" _fcksavedurl="#">2</a></li> <li><a href="#" _fcksavedurl="#">3</a></li> <li><a href="#" _fcksavedurl="#">4</a></li> <li><a href="#" _fcksavedurl="#">5</a></li> <li><a href="#" _fcksavedurl="#">6</a></li> <li><a href="#" _fcksavedurl="#">7</a></li> <li><a href="#" _fcksavedurl="#">8</a></li> <li><a href="#" _fcksavedurl="#">9</a></li> <li><a href="#" _fcksavedurl="#">10 </a></li> </ul> </td> </tr> <tr> <td><div id="yesilgeri"><a href="#" _fcksavedurl="#">< Önceki</a></div> <div id="yesilileri"><a href="#" _fcksavedurl="#">Sonraki ></a></div></td> </tr> </table> </div>

Sayfa Numaralandırma Turuncu

1 2 3 4 5 6 7 8 9 10

< Önceki Sonraki >

<style type="text/css"> #turuncnumara { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaraturunctb.png); height: 77px; width: 500px; margin-right: auto; margin-left: auto; } #turuncnumara ul { list-style-type: none; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 17px; } #turuncnumara ul li { float: left; width: 38px; margin-right: 7px; } #turuncnumara ul li a { height: 30px; width: 38px; text-align: center; display: block; color: #9A4B0C; font-family: Tahoma; font-size: 18px; text-decoration: none; margin-top: 18px; line-height: 30px; } #turuncnumara ul li a:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik2/numaraturunchv.png); height: 39px; width: 38px; margin-top: 11px; } #turuncgeri { float: left; margin-top: 3px; position: relative; width: 75px; } #turuncgeri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #9A4B0C; } #turuncgeri a:hover { color: #fff; } #turuncileri { float: right; margin-top: 3px; position: relative; width: 75px; } #turuncileri a { font-family: Tahoma; font-size: 14px; text-decoration: none; color: #9A4B0C; } #turuncileri a:hover { color: #fff; } </style> <div id="turuncnumara"> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" valign="top"> <ul> <li><a href="#" _fcksavedurl="#">1</a></li> <li><a href="#" _fcksavedurl="#">2</a></li> <li><a href="#" _fcksavedurl="#">3</a></li> <li><a href="#" _fcksavedurl="#">4</a></li> <li><a href="#" _fcksavedurl="#">5</a></li> <li><a href="#" _fcksavedurl="#">6</a></li> <li><a href="#" _fcksavedurl="#">7</a></li> <li><a href="#" _fcksavedurl="#">8</a></li> <li><a href="#" _fcksavedurl="#">9</a></li> <li><a href="#" _fcksavedurl="#">10 </a></li> </ul> </td> </tr> <tr> <td><div id="turuncgeri"><a href="#" _fcksavedurl="#">< Önceki</a></div> <div id="turuncileri"><a href="#" _fcksavedurl="#">Sonraki ></a></div></td> </tr> </table> </div>