سلام
من این کد رو دارم
و میخوام مثل این عکس نمایش داده بشه
چه کدی باید اضافه کنم؟
<li> <div class="banner-info1-grid" style="margin-left:10px"> <a href="#" rel="lightbox[portfolio]"> <img src="~/sliderblog/images/logo.png" alt="لوگو" title="لوگو" class="img-responsive" /> </a> <h3> طراحی لوگو </h3> <p>طراحی لوگو ( نماد ) شرکت و برند شما با ارائه بهترین طرح های خلاقانه و استاندارد جهت استفاده در برندسازی و تبلیغات</p> </div> </li> <li> <div class="banner-info1-grid"> <a href="#" rel="lightbox[portfolio]"> <img src="~/sliderblog/images/card-visit.png" alt="کارت ویزیت" title="کارت ویزیت" class="img-responsive" /> </a> <h3> طراحی کارت ویزیت </h3> <p>طراحی انواع کارت ویزیت با گرافیک بسیار حرفه ای و خیره کننده در طرح های نوین با رعایت کامل استاندارهای صنعت چاپ</p> </div> </li> <li> <div class="banner-info1-grid"> <a href="#" rel="lightbox[portfolio]"> <img src="~/sliderblog/images/support.png" alt=" مشاوره رایگان" title=" مشاوره رایگان" class="img-responsive" /> </a> <h3> مشاوره رایگان </h3> <p>ارائه خدمات مشاوره به صورت رایگان در موضوعات طراحی، تبلیغات و بازاریابی اینترنتی جهت افزایش بازدهی و فروش محصولات و خدمات شما</p> </div> </li>
میخوام بدین صورت نمایش داده بشه
کد css این قسمت را هم قرار دهید .
این css رو دارم فقط
.banner-info1-grid { text-align: center; } .banner-info1-grid img { border: 2px solid #fff; border-radius: 100%; margin: 0 auto; } .banner-info1-grid h3 { font-size: 2em; color: #F88928; margin: 1em 0 .5em; text-transform: capitalize; } .banner-info1-grid p { font-size: 14px; color: #000; line-height: 1.8em; margin: 0 auto; width: 80%;
کد css خودتون رو به شکل زیر تغییر دهید :
body { direction: rtl; } ul.box li { display: inline-table; border-left: 1px solid #eee; width: 32%; } ul.box li:last-child { border-left: none; } ul.box li img.img-responsive { width: 50%; height: auto; } .banner-info1-grid { text-align: center; } .banner-info1-grid img { border: 2px solid #eee; border-radius: 100%; margin: 0 auto; } .banner-info1-grid h3 { font-size: 2em; color: #F88928; margin: 1em 0 .5em; text-transform: capitalize; } .banner-info1-grid p { font-size: 14px; color: #000; line-height: 1.8em; margin: 0 auto; width: 80%; }
فایل ضمیمه شده به صورت کامل صفحه html به همراه css و تصاویر آن را شامل میشود.
هیچ کاربری تا کنون از این پست تشکر نکرده است
با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)