درخواست نمونه کدهای جدول

[saeeddeeas 8]

سلام

یک سری نمونه کد برای جدول تعرفه محصولات میخوام از صبح دارم کل نت زیرو رو میکنم نتونستم اونی که میخوام پیدا کنم

یه جدول خوشگل میخوام

[alireza1375 892]

چه طور پیدا نکردید

http://jsfiddle.net/98YUE/2/

[Farzad 3805]

ژنراتور جدول :

http://www.csstablegenerator.com/
http://tablestyler.com/
http://coveloping.com/tools/pricing-tables
http://pricerninja.com/
http://www.codesynthesis.co.uk/tools/pricing-table-generator
http://compareninja.com/

اگر کافی نبود، جسنجو کنید : price table generator

پیشنهاد من : مورد سوم.

[saeeddeeas 8]

دوستان چیزی میخوام که تو این مایه ها باشه

http://gigup.ir/do.php?img=36

[imanfakhar 26231]

http://jsbin.com/kasevebu/2

[ممد 88]

من از

http://www.csstablegenerator.com/
http://tablestyler.com/

جدول ساختم ولی نمیدونم چرا موقع نمایش ستون اول و دوم رو بهم میچسبونه.

نمونه اینجا

http://gitimarket.ir/manhunt/ddd/

مشکل از کجاست؟؟؟

[s4d3ghi 246]

از افزونه ind pricing table استفاده کنید بهتره

البته افزونه ها زیادند اما من از این یکی استفاده کردم

[kasra 4929]

کد html :

<div id="pricing-table" class="pricing-table">
						    <ul>
							    <li class="heading">Bronze</li>
							    <li class="price">£20</li>
							    <li>Starter package</li>
							    <li>15 Projects</li>
							    <li class="action">Buy Now</li>
						    </ul>
						    <ul class="feature">
							    <li class="heading">Silver</li>
							    <li class="price">£60</li>
							    <li>Intermediate package</li>
							    <li>20 Projects</li>
							    <li class="action">Buy Now</li>
						    </ul>
						    <ul>
							    <li class="heading">Gold</li>
							    <li class="price">£80</li>
							    <li>Professional package</li>
							    <li>30 Projects</li>
							    <li class="action">Buy Now</li>
						    </ul>
					    </div>

کد استایل :

<style>
.pricing-table ul{
    border-width: 1px;
    border-style: solid;
    border-color: #cccccc;
    border-radius: 3px;
    margin: 2px;
    width: 200px;
    text-align: center;
    list-style: none;
    float: left;
    padding: 5px;
    background-color: #ffffff;
}
.pricing-table ul li{
    padding: 5px;
    background-color: #ffffff;
    border-width: 0px;
    border-style: dotted;
    border-color: #B8B8B8;
    border-radius: 0px;
    border-bottom-width: 1px;
    font-size: 13px;
}
.pricing-table li:first-child{
    border-bottom: 0;
}
.pricing-table li:last-child{
    border-bottom: 0;
}
.pricing-table li:nth-child(odd){
    background-color: #FFFFFF;
}
.pricing-table ul .heading{
    color: #FFFFFF;
    background-color: #545454;
    font-size: 16px;
}
.pricing-table ul .price{
    color: #636363;
    background-color: #FFFFFF;
    font-size: 20px;
}
.pricing-table ul .action{
    font-size: 14px;
    background-color: #F5F5F5;
    color: #4F4F4F;
}
.feature{
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    box-shadow: 3px 5px 7px rgba(0,0,0,.7);
}
.pricing-table .action a{
    border-color: #B83737;
    border-width: 0px;
    border-radius: 2px;
    background-color: #EEEEEE;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
    border-style: solid;
    color: #000000;
}
</style>