فراغیب

الگو:کانتینر متن و کارت: تفاوت میان نسخه‌ها

→ تفاوت با ویرایش قدیمی‌تر
دیداریویکی‌متن
بدون خلاصۀ ویرایش
بدون خلاصۀ ویرایش
 
(۵ نسخهٔ میانیِ ایجادشده توسط همین کاربر نشان داده نشد)
خط ۱: خط ۱:
 
<html>
<html lang="fa" dir="rtl">
 
<head>
<head>
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <meta charset="UTF-8">
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
    <title>همراه مطمئن شما در انجام خدمات اینترنتی و اداری | کافی نت</title>
 
    <meta name="description" content="ارائه خدمات حرفه‌ای کافی نت شامل ثبت نام، خدمات دولت الکترونیک، امور بانکی، بیمه، مالیات، ترجمه، رزرو بلیط و صدها خدمت آنلاین دیگر.">
 
    <meta name="keywords" content="کافی نت، خدمات کافی نت، ثبت نام اینترنتی، خدمات آنلاین، خدمات اداری">
 
    <meta name="robots" content="index,follow">
 
    <link rel="preconnect" href="https://fonts.googleapis.com">
 
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 
    <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
 
    <link rel="stylesheet" href="common.css">
 
</head>
</head>
<section class="stats-section">
  <div class="container">
    <div class="text-side">
      <h2>همراه و در کنار شماییم</h2>
      <p>با کافی نت من به بیش از صدها خدمات اینترنتی بصورت کاملاً غیرحضوری دسترسی دارین. فقط با چند کلیک ساده سفارش شما در دستان شما قرار دارد.</p>
    </div>


<body>
     <div class="stats-grid">
 
      <article class="stat-card">
<section class="about-cafenet">
        <i class="icon fa fa-check-circle"></i>
 
        <div class="stat-info">
     <div class="container">
          <span class="number">+50k</span>
 
          <p>خدمت ارائه شده</p>
        <!-- ==========================
        </div>
                کارت های آماری
      </article>
        =========================== -->
      <article class="stat-card">
 
        <i class="icon fa fa-users"></i>
        <div class="stats-wrapper">
        <div class="stat-info">
 
          <span class="number">+500k</span>
            <div class="stats-shadow"></div>
          <p>کاربر فعال</p>
 
        </div>
            <!-- کارت 1 -->
      </article>
 
      <article class="stat-card">
            <article class="stat-card">
        <i class="icon fa fa-smile"></i>
 
        <div class="stat-info">
                <div class="card-top">
          <span class="number">100%</span>
 
          <p>رضایت مشتریان</p>
                    <div class="icon">
                        <i class="fa-solid fa-file-circle-check"></i>
                    </div>
 
                    <span class="card-title">
                        خدمات انجام شده
                    </span>
 
                </div>
 
                <h3>+۵۰ هزار</h3>
 
            </article>
 
            <!-- کارت 2 -->
 
            <article class="stat-card">
 
                <div class="card-top">
 
                    <div class="icon">
                        <i class="fa-solid fa-users"></i>
                    </div>
 
                    <span class="card-title">
                        مشتریان دائمی
                    </span>
 
                </div>
 
                <h3>+۵ هزار</h3>
 
            </article>
 
            <!-- کارت 3 -->
 
            <article class="stat-card">
 
                <div class="card-top">
 
                    <div class="icon">
                        <i class="fa-solid fa-face-smile"></i>
                    </div>
 
                    <span class="card-title">
                        رضایت کاربران
                    </span>
 
                </div>
 
                <h3>۹۹٪</h3>
 
            </article>
 
            <!-- کارت 4 -->
 
            <article class="stat-card">
 
                <div class="card-top">
 
                    <div class="icon">
                        <i class="fa-solid fa-calendar-check"></i>
                    </div>
 
                    <span class="card-title">
                        سابقه فعالیت
                    </span>
 
                </div>
 
                <h3>۱۰+ سال</h3>
 
            </article>
 
         </div>
         </div>
 
      </article>
        <!-- ==========================
      <article class="stat-card">
                متن
        <i class="icon fa fa-calendar-alt"></i>
        =========================== -->
        <div class="stat-info">
 
          <span class="number">+2000</span>
        <div class="about-content">
          <p>روز حضور در مارکت</p>
 
            <span class="section-subtitle">
                خدمات حرفه‌ای کافی نت
            </span>
 
            <h2>
                همراه مطمئن شما در انجام خدمات اینترنتی و اداری
            </h2>
 
            <p>
 
                تمامی خدمات اینترنتی، اداری و ثبت‌نامی را با سرعت، دقت و امنیت بالا انجام می‌دهیم. از ثبت‌نام آزمون‌ها و سامانه‌های دولتی گرفته تا خدمات بانکی، مالیاتی، بیمه، ترجمه مدارک، رزرو بلیط، ثبت شرکت، امور دانشگاهی و صدها خدمت آنلاین دیگر، همه در کوتاه‌ترین زمان و با پشتیبانی کامل انجام می‌شود.
 
            </p>
 
            <a href="/services" class="main-btn">
 
                مشاهده تمامی خدمات
 
                <i class="fa-solid fa-arrow-left"></i>
 
            </a>
 
         </div>
         </div>
 
      </article>
     </div>
     </div>
 
  </div>
</section>
</section>
</body>


</html>
</html>
برگرفته از «https://fa.faraghaib.ir/wiki/الگو:کانتینر_متن_و_کارت»