کادر اطلاعاتی - فراغیب

نسخهٔ ‏۲۰ ژوئیهٔ ۲۰۲۶، ساعت ۰۸:۰۹

چاپ بنر در چاپ متین

هنگامی که شما از خدمات چاپ و تبلیغات نعمتی بازدید می‌کنید، لازم نیست نگران از کیفیت بنر و یا چاپ سررسید اختصاصی خود باشید. اگر قبلاً بنر خود را طراحی کرده‌اید، به سادگی فایل‌های آماده خود را بر روی سایت ما آپلود کنید. بعد از اینکه سفارش خود را ارسال کردید، فایل‌های شما را بررسی می‌کنیم تا اطمینان حاصل شود که فایل‌ها دارای شرایط درست و دقیق هستند و ما در نهایت برای شما تأیید چاپ روی بنر را ارسال خواهیم کرد.

@@ خط ۱: / خط ۱: @@
 <html>
-<!-- Banner Info Box - Faragheib Design -->
+<!-- شروع کد باکس خدمات -->
-<div class="advertising-box">
+<div class="f-box-wrapper">
-    <h2 class="box-title">خدمات چاپ و تبلیغات نعمتی</h2>
+    <div class="f-box-content">
-    <p class="box-content">
+        <h2 class="f-box-title">چاپ بنر در چاپ متین</h2>
-        هنگامی که شما از <strong>خدمات چاپ و تبلیغات نعمتی</strong> بازدید می‌کنید، لازم نیست نگران از کیفیت بنر و یا <strong>چاپ سررسید اختصاصی</strong> خود باشید. اگر قبلاً بنر خود را طراحی کرده‌اید، به سادگی فایل‌های آماده خود را بر روی سایت ما آپلود کنید. بعد از اینکه سفارش خود را ارسال کردید، فایل‌های شما را بررسی می‌کنیم تا اطمینان حاصل شود که فایل‌ها دارای شرایط درست و دقیق هستند و ما در نهایت برای شما تأیید <strong>چاپ روی بنر</strong> را ارسال خواهیم کرد.
+        <p class="f-box-text">
-     </p>
+            هنگامی که شما از <strong>خدمات چاپ و تبلیغات نعمتی</strong> بازدید می‌کنید، لازم نیست نگران از کیفیت بنر و یا <strong>چاپ سررسید اختصاصی</strong> خود باشید. اگر قبلاً بنر خود را طراحی کرده‌اید، به سادگی فایل‌های آماده خود را بر روی سایت ما آپلود کنید. بعد از اینکه سفارش خود را ارسال کردید، فایل‌های شما را بررسی می‌کنیم تا اطمینان حاصل شود که فایل‌ها دارای شرایط درست و دقیق هستند و ما در نهایت برای شما تأیید <strong>چاپ روی بنر</strong> را ارسال خواهیم کرد.
+        </p>
+     </div>
 </div>
 <style>
-    .advertising-box {
+/* استایل جامع باکس */
-        background-color: #ffffff;
+.f-box-wrapper {
-        border-top: 4px solid #a11e1e; /* خط قرمز تیره بالای باکس مشابه تصویر */
+    position: relative;
-        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15), 0 6px 6px rgba(0, 0, 0, 0.1);
+    width: 100%;
-        padding: 25px;
+    max-width: 900px;
-        margin: 20px auto;
+    margin: 40px auto;
-        max-width: 900px; /* کنترل پهنای باکس */
+    padding-bottom: 20px;
-        border-radius: 2px;
+}
-        direction: rtl; /* راست‌چین */
-        font-family: 'iransans', 'Segoe UI', Arial, sans-serif; /* فونت استاندارد وب */
-    }
-    .box-title {
+.f-box-content {
-        text-align: center;
+    position: relative;
-        font-size: clamp(1.2rem, 4vw, 1.6rem); /* ریسپانسیو کردن اندازه فونت تیتر */
+    background: #fff;
-        color: #333;
+    border-top: 4px solid #b71c1c; /* رنگ قرمز تیره */
-        margin-bottom: 20px;
+    padding: 30px;
-        font-weight: bold;
+    border-left: 1px solid #e0e0e0;
-     }
+    border-right: 1px solid #e0e0e0;
+    border-bottom: 1px solid #e0e0e0;
+    z-index: 2;
+     direction: rtl;
+    text-align: right;
+}
-    .box-content {
+.f-box-title {
-        text-align: justify; /* تراز متن از طرفین */
+    font-size: 1.5rem;
-        line-height: 1.8; /* بهبود خوانایی */
+    font-weight: bold;
-        color: #555;
+    color: #333;
-        font-size: clamp(0.9rem, 2.5vw, 1rem); /* ریسپانسیو کردن متن پاراگراف */
+    margin-bottom: 20px;
-        margin: 0;
+    text-align: center;
-    }
+}
-    .box-content strong {
+.f-box-text {
-        color: #a11e1e; /* رنگ متمایز برای کلمات کلیدی جهت سئو */
+    font-size: 1rem;
-        font-weight: 700;
+    line-height: 1.8;
-     }
+    color: #555;
+    text-align: justify;
+     margin: 0;
+}
-     /* بهینه‌سازی برای موبایل */
+.f-box-text strong {
-    @media (max-width: 600px) {
+    color: #b71c1c;
-        .advertising-box {
+     font-weight: 700;
-            padding: 15px;
+}
-            margin: 10px;
-        }
+/* ایجاد سایه گوشه‌دار (مختص گوشه‌ها) */
-    }
+.f-box-wrapper::before,
+.f-box-wrapper::after {
+    content: "";
+    position: absolute;
+    bottom: 10px;
+    left: 20px;
+    width: 40%;
+    height: 20px;
+    background: transparent;
+    box-shadow: 0 15px 15px rgba(0,0,0,0.3);
+    transform: rotate(-3deg);
+    z-index: 1;
+}
+.f-box-wrapper::after {
+    left: auto;
+    right: 20px;
+    transform: rotate(3deg);
+}
+/* واکنش‌گرایی برای موبایل */
+@media (max-width: 600px) {
+    .f-box-content { padding: 20px; }
+    .f-box-wrapper { margin: 20px 10px; width: auto; }
+}
 </style>
+<!-- پایان کد باکس خدمات -->
 </html>