Logo v4.1
图片描述内容

没结果

  • 获取支持
  • 预览演示
Logo v4.1
  • 文档
  • 代码片段
  • 代码片段
  • 介绍
  • Navbar / Heroes
  • Headers (Navbar)
  • Hero Sections
  • Content
  • 功能
    一般 统计 Step 导航(标签)
  • Icon Blocks
  • Cards
    Grid List
  • Directory
    Grid List
  • 客户评价
  • 博客s
    Grid List
  • Tables
  • E-commerce
  • 价格
  • Team Sections
  • 面包屑
  • 号召性用语(CTA)
  • Modals
  • 证券投资
  • 画廊
  • 客户
  • Countdown
  • FAQ
  • Lists
  • 折叠/手风琴
  • Comments
  • 反馈 & 评论
  • User Profile
  • 侧边栏示例
  • 日历视图
  • 通知
  • 内容部分
  • Forms
  • 身份验证
  • 反馈
  • Filters
  • Search
  • Directory
  • 订阅
  • 账户中心
  • Wizard & Steps
  • 联系方式/页脚
  • 联系方式
  • Footer

Card List

Component #1

  • 预览
  • HTML

Dedicated app development platform

From open source to premium services.

  • Mobile devs
  • App builder
  • Subscriptions Beta
  • 集成

Included

Full integration guidance and resources.

Get Started
              
                <!-- Card -->
                <div class="container">
                  <div class="w-lg-85 mx-lg-auto">
                    <!-- Card -->
                    <div class="card">
                      <div class="card-body">
                        <div class="row col-md-divider align-items-md-center">
                          <div class="col-md-9">
                            <h3>Dedicated app development platform</h3>
                            <p>From open source to premium services.</p>

                            <div class="row">
                              <div class="col-sm-6">
                                <!-- List Checked -->
                                <ul class="list-checked list-checked-bg-success list-checked-sm mb-0">
                                  <li class="list-checked-item">Mobile devs</li>
                                  <li class="list-checked-item">App builder</li>
                                </ul>
                                <!-- End List Checked -->
                              </div>
                              <!-- End Col -->

                              <div class="col-sm-6">
                                <!-- List Checked -->
                                <ul class="list-checked list-checked-bg-success list-checked-sm mb-0">
                                  <li class="list-checked-item">Subscriptions <span class="badge bg-soft-secondary text-dark rounded-pill ms-1">Beta</span></li>
                                  <li class="list-checked-item">Integrations</li>
                                </ul>
                                <!-- End List Checked -->
                              </div>
                              <!-- End Col -->
                            </div>
                            <!-- End Row -->
                          </div>
                          <!-- End Col -->

                          <div class="col-md-3">
                            <div class="ps-md-2">
                              <h4>Included</h4>
                              <p>Full integration guidance and resources.</p>
                              <a class="link" href="#">Get Started <i class="bi-chevron-right small ms-1"></i></a>
                            </div>
                          </div>
                          <!-- End Col -->
                        </div>
                        <!-- End Row -->
                      </div>
                    </div>
                    <!-- End Card -->
                  </div>
                </div>
                <!-- End Card -->
              
            

Component #2

  • 预览
  • HTML

Hubble

The more affordable daily contact lens. Modify or cancel anytime.

Logo
“ The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. 谢谢! ”
图片描述内容
Max Fitbit Agency Partner
图片描述内容

支持 and win

When we empower others to succeed, we all win. (And we're not talking about participation trophies.)

Open communication

We're big fans of transparency for many reasons, but the abridged version is: it makes easier.

Curology

For healthy and beautiful skin, get skincare customized just for you from experts at Curology.

Logo
“ I am absolutely floored by the level of care and attention to detail the team at Htmlstream have put into this theme and for one can guarantee that I will be a return customer. ”
图片描述内容
Luisa Executive Creative Director
图片描述内容

Hit heavy, stay small

Tight-knit, dynamic teams work with more agility, communication, and freedom than large-scale companies.

Ambition by the boatload

We love people who aim for greatness. They inspire and excite their teammates, raising the bar for all of us.

Larq

LARQ Bottle Benefit Edition. 0. Lives will be saved with access. to clean water.

Logo
“ It's a beautiful looking theme with great support from the developers. The included demos are a great way to understand the theme, its features and speed up development. ”
图片描述内容
Christina Head of Commercials
图片描述内容

Autonomy and attitude

We're a team of self-starters who take serious pride in our work – and it shows.

Teamwork makes the dream work

We work together to bring our passions and expertise to make Teachable the best it can be.

              
                <!-- Portfolio -->
                <div id="caseStudies" class="container content-space-2 content-space-lg-3">
                  <div class="d-grid gap-7 gap-md-10">
                    <!-- Card -->
                    <div data-aos="fade-up">
                      <a class="card card-transition bg-soft-success shadow-none" href="#">
                        <div class="card-body">
                          <div class="row">
                            <div class="col-lg-4 order-lg-2 mb-5 mb-lg-0">
                              <div class="d-flex flex-column h-100">
                                <div class="mb-7">
                                  <h2 class="card-title h1">Hubble</h2>
                                  <p class="card-text text-body">The more affordable daily contact lens. Modify or cancel anytime.</p>
                                </div>

                                <!-- Testimonials -->
                                <div class="card shadow-none mt-auto">
                                  <div class="card-body">
                                    <!-- Blockquote -->
                                    <figure>
                                      <div class="mb-4">
                                        <img class="avatar avatar-lg avatar-4x3" src="../assets/svg/brands/fitbit-dark.svg" alt="Logo">
                                      </div>

                                      <blockquote class="blockquote">“ The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. 谢谢! ”</blockquote>

                                      <figcaption class="blockquote-footer">
                                        <div class="d-flex align-items-center">
                                          <div class="flex-shrink-0">
                                            <img class="avatar avatar-circle" src="../assets/img/160x160/img3.jpg" alt="图片描述内容">
                                          </div>

                                          <div class="flex-grow-1 ms-3">
                                            Max
                                            <span class="blockquote-footer-source">Fitbit Agency Partner</span>
                                          </div>
                                        </div>
                                      </figcaption>        
                                    </figure>
                                    <!-- End Blockquote -->
                                  </div>
                                </div>
                                <!-- End Testimonials -->
                              </div>
                            </div>
                            <!-- End Col -->

                            <div class="col-lg-8">
                              <div class="mb-5">
                                <img class="img-fluid rounded-2" src="../assets/img/900x450/img16.jpg" alt="图片描述内容">
                              </div>

                              <div class="row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                  <h4 class="card-title">Support and win</h4>
                                  <p class="card-text text-body">When we empower others to succeed, we all win. (And we're not talking about participation trophies.)</p>
                                </div>
                                <!-- End Col -->

                                <div class="col-sm-6">
                                  <h4 class="card-title">Open communication</h4>
                                  <p class="card-text text-body">We're big fans of transparency for many reasons, but the abridged version is: it makes easier.</p>
                                </div>
                                <!-- End Col -->
                              </div>
                              <!-- End Row -->
                            </div>
                            <!-- End Col -->
                          </div>
                          <!-- End Row -->
                        </div>
                      </a>
                    </div>
                    <!-- End Card -->

                    <!-- Card -->
                    <div data-aos="fade-up">
                      <a class="card card-transition bg-soft-danger shadow-none" href="#">
                        <div class="card-body">
                          <div class="row">
                            <div class="col-lg-4 mb-5 mb-lg-0">
                              <div class="d-flex flex-column h-100">
                                <div class="mb-7">
                                  <h2 class="card-title h1">Curology</h2>
                                  <p class="card-text text-body">For healthy and beautiful skin, get skincare customized just for you from experts at Curology.</p>
                                </div>

                                <!-- Testimonials -->
                                <div class="card shadow-none mt-auto">
                                  <div class="card-body">
                                    <!-- Blockquote -->
                                    <figure>
                                      <div class="mb-4">
                                        <img class="avatar avatar-lg avatar-4x3" src="../assets/svg/brands/airbnb-dark.svg" alt="Logo">
                                      </div>

                                      <blockquote class="blockquote">“ I am absolutely floored by the level of care and attention to detail the team at Htmlstream have put into this theme and for one can guarantee that I will be a return customer. ”</blockquote>

                                      <figcaption class="blockquote-footer">
                                        <div class="d-flex align-items-center">
                                          <div class="flex-shrink-0">
                                            <img class="avatar avatar-circle" src="../assets/img/160x160/img10.jpg" alt="图片描述内容">
                                          </div>

                                          <div class="flex-grow-1 ms-3">
                                            Luisa
                                            <span class="blockquote-footer-source">Executive Creative Director</span>
                                          </div>
                                        </div>
                                      </figcaption>        
                                    </figure>
                                    <!-- End Blockquote -->
                                  </div>
                                </div>
                                <!-- End Testimonials -->
                              </div>
                            </div>
                            <!-- End Col -->

                            <div class="col-lg-8">
                              <div class="mb-5">
                                <img class="img-fluid rounded-2" src="../assets/img/900x450/img15.jpg" alt="图片描述内容">
                              </div>

                              <div class="row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                  <h4 class="card-title">Hit heavy, stay small</h4>
                                  <p class="card-text text-body">Tight-knit, dynamic teams work with more agility, communication, and freedom than large-scale companies.</p>
                                </div>
                                <!-- End Col -->

                                <div class="col-sm-6">
                                  <h4 class="card-title">Ambition by the boatload</h4>
                                  <p class="card-text text-body">We love people who aim for greatness. They inspire and excite their teammates, raising the bar for all of us.</p>
                                </div>
                                <!-- End Col -->
                              </div>
                              <!-- End Row -->
                            </div>
                            <!-- End Col -->
                          </div>
                          <!-- End Row -->
                        </div>
                      </a>
                    </div>
                    <!-- End Card -->

                    <!-- Card -->
                    <div data-aos="fade-up">
                      <a class="card card-transition bg-soft-warning shadow-none" href="#">
                        <div class="card-body">
                          <div class="row">
                            <div class="col-lg-4 order-lg-2 mb-5 mb-lg-0">
                              <div class="d-flex flex-column h-100">
                                <div class="mb-7">
                                  <h2 class="card-title h1">Larq</h2>
                                  <p class="card-text text-body">LARQ Bottle Benefit Edition. 0. Lives will be saved with access. to clean water.</p>
                                </div>

                                <!-- Testimonials -->
                                <div class="card shadow-none mt-auto">
                                  <div class="card-body">
                                    <!-- Blockquote -->
                                    <figure>
                                      <div class="mb-4">
                                        <img class="avatar avatar-lg avatar-4x3" src="../assets/svg/brands/shopify-dark.svg" alt="Logo">
                                      </div>

                                      <blockquote class="blockquote">“ It's a beautiful looking theme with great support from the developers. The included demos are a great way to understand the theme, its features and speed up development. ”</blockquote>

                                      <figcaption class="blockquote-footer">
                                        <div class="d-flex align-items-center">
                                          <div class="flex-shrink-0">
                                            <img class="avatar avatar-circle" src="../assets/img/160x160/img8.jpg" alt="图片描述内容">
                                          </div>

                                          <div class="flex-grow-1 ms-3">
                                            Christina
                                            <span class="blockquote-footer-source">Head of Commercials</span>
                                          </div>
                                        </div>
                                      </figcaption>        
                                    </figure>
                                    <!-- End Blockquote -->
                                  </div>
                                </div>
                                <!-- End Testimonials -->
                              </div>
                            </div>
                            <!-- End Col -->

                            <div class="col-lg-8">
                              <div class="mb-5">
                                <img class="img-fluid rounded-2" src="../assets/img/900x450/img17.jpg" alt="图片描述内容">
                              </div>

                              <div class="row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                  <h4 class="card-title">Autonomy and attitude</h4>
                                  <p class="card-text text-body">We're a team of self-starters who take serious pride in our work – and it shows.</p>
                                </div>
                                <!-- End Col -->

                                <div class="col-sm-6">
                                  <h4 class="card-title">Teamwork makes the dream work</h4>
                                  <p class="card-text text-body">We work together to bring our passions and expertise to make Teachable the best it can be.</p>
                                </div>
                                <!-- End Col -->
                              </div>
                              <!-- End Row -->
                            </div>
                            <!-- End Col -->
                          </div>
                          <!-- End Row -->
                        </div>
                      </a>
                    </div>
                    <!-- End Card -->
                  </div>
                </div>
                <!-- End Portfolio -->