|
|
| (۱۲ نسخهٔ میانیِ ایجادشده توسط همین کاربر نشان داده نشد) |
| خط ۱: |
خط ۱: |
| <html> | | <html> |
| <!-- شروع کد باکس عریض خدمات - طراحی شده برای فراغیب -->
| | <div class="nikan-box"> |
| <div class="f-wide-box-wrapper"> | | <!-- متن خود را اینجا وارد کنید --> |
| <div class="f-wide-box-content"> | | <p>هنگامی که شما از چاپ متین بازدید میکنید، لازم نیست نگران از کیفیت بنر و یا چاپ سررسید اختصاصی خود باشید...</p> |
| <h2 class="f-wide-box-title">چاپ بنر در چاپ متین</h2>
| |
| <p class="f-wide-box-text"> | |
| هنگامی که شما از <strong>خدمات چاپ و تبلیغات نعمتی</strong> بازدید میکنید، لازم نیست نگران از کیفیت بنر و یا <strong>چاپ سررسید اختصاصی</strong> خود باشید. اگر قبلاً بنر خود را طراحی کردهاید، به سادگی فایلهای آماده خود را بر روی سایت ما آپلود کنید. بعد از اینکه سفارش خود را ارسال کردید، فایلهای شما را بررسی میکنیم تا اطمینان حاصل شود که فایلها دارای شرایط درست و دقیق هستند و ما در نهایت برای شما تأیید <strong>چاپ روی بنر</strong> را ارسال خواهیم کرد.
| |
| </p>
| |
| </div>
| |
| </div> | | </div> |
|
| |
| <style>
| |
| /* استایل باکس عریض */
| |
| .f-wide-box-wrapper {
| |
| position: relative;
| |
| width: 95%; /* استفاده از اکثر عرض صفحه */
| |
| max-width: 1250px; /* حداکثر عرض مجاز برای خوانایی بهتر */
| |
| margin: 50px auto;
| |
| padding-bottom: 25px;
| |
| }
| |
|
| |
| .f-wide-box-content {
| |
| position: relative;
| |
| background: #ffffff;
| |
| border-top: 5px solid #a11e1e; /* خط قرمز بالایی */
| |
| padding: 35px 45px; /* فضای داخلی بیشتر برای باکس عریض */
| |
| border-left: 1px solid #e5e5e5;
| |
| border-right: 1px solid #e5e5e5;
| |
| border-bottom: 1px solid #e5e5e5;
| |
| z-index: 2;
| |
| direction: rtl;
| |
| border-radius: 2px;
| |
| }
| |
|
| |
| .f-wide-box-title {
| |
| font-size: 1.6rem;
| |
| font-weight: bold;
| |
| color: #222;
| |
| margin-bottom: 25px;
| |
| text-align: center;
| |
| font-family: 'Tahoma', sans-serif;
| |
| }
| |
|
| |
| .f-wide-box-text {
| |
| font-size: 1.05rem;
| |
| line-height: 1.9; /* فاصله خطوط بیشتر برای خوانایی در عرض زیاد */
| |
| color: #444;
| |
| text-align: justify; /* تراز از طرفین طبق درخواست */
| |
| margin: 0;
| |
| font-family: 'Tahoma', sans-serif;
| |
| }
| |
|
| |
| .f-wide-box-text strong {
| |
| color: #a11e1e;
| |
| font-weight: 700;
| |
| }
| |
|
| |
| /* ایجاد سایه گوشهها مشابه عکس (تمرکز در دو طرف، محو در وسط) */
| |
| .f-wide-box-wrapper::before,
| |
| .f-wide-box-wrapper::after {
| |
| content: "";
| |
| position: absolute;
| |
| bottom: 12px;
| |
| left: 25px;
| |
| width: 45%;
| |
| height: 25px;
| |
| background: transparent;
| |
| box-shadow: 0 18px 18px rgba(0,0,0,0.35); /* سایه عمیقتر برای گوشهها */
| |
| transform: rotate(-2.5deg); /* زاویه ملایمتر برای باکس عریض */
| |
| z-index: 1;
| |
| }
| |
|
| |
| .f-wide-box-wrapper::after {
| |
| left: auto;
| |
| right: 25px;
| |
| transform: rotate(2.5deg);
| |
| }
| |
|
| |
| /* بهینهسازی ریسپانسیو */
| |
| @media (max-width: 768px) {
| |
| .f-wide-box-content { padding: 25px; }
| |
| .f-wide-box-wrapper { width: 92%; margin: 25px auto; }
| |
| .f-wide-box-wrapper::before, .f-wide-box-wrapper::after { bottom: 15px; width: 40%; }
| |
| }
| |
| </style>
| |
| <!-- پایان کد باکس عریض -->
| |
|
| |
|
| |
|
| </html> | | </html> |