Modèles de réalisations
1°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="columns">
<div class="column is-9"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3">
<div class="columns is-mobile is-multiline">
<div class="column is-4-mobile is-12-tablet"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="column is-4-mobile is-12-tablet"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="column is-4-mobile is-12-tablet"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column is-half">
<h4 class="title is-spaced is-4">Client: K-Hole</h4>
<p class="subtitle">We are constantly looking for new partners to migrate onto the Piper Net.
The future of the internet is here - venture towards it with Pied Piper!</p>
</div>
</div>
</div>
</section>
</div>
2°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container has-text-centered">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="block"><a href="#"><img src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?
primary=00d1b2"
alt=""></a></div>
<div class="columns is-mobile">
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
</div>
<h4 class="title is-spaced is-4">Client: K-Hole</h4>
<p class="subtitle">We are constantly looking for new partners to migrate onto the Piper Net.
The future of the internet is here - venture towards it with Pied Piper!</p>
</div>
</section>
</div>
3°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container has-text-centered">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="tabs is-centered">
<ul>
<li class="is-active"><a href="#">Startups</a></li>
<li><a href="#">Corporations</a></li>
<li><a href="#">Individuals</a></li>
</ul>
</div>
<div class="columns">
<div class="column">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p>We are constantly looking for new partners to migrate onto the PiperNet. The future
of the internet is here - venture towards it with Pied Piper!</p>
</div>
</div>
</div>
<div class="column">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p>We are constantly looking for new partners to migrate onto the PiperNet. The future of
the internet is here - venture towards it with Pied Piper!</p>
</div>
</div>
</div>
</div>
<div class="block">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p>We are constantly looking for new partners to migrate onto the PiperNet. The future of
the internet is here - venture towards it with Pied Piper!</p>
</div>
</div>
</div>
<div class="buttons is-centered"><a class="button is-primary" href="#">View all PiperNet clients
</a></div>
</div>
</section>
</div>
4°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container">
<div class="columns is-vcentered">
<div class="column">
<h2 class="title is-spaced">Great Companies that already use PiperNet.</h2>
<p class="subtitle">We are constantly looking for new partners to migrate onto the Piper Net.
The future of the internet ishere - venture towards it with Pied Piper!</p><a href="#">View all
PiperNet clients</a>
</div>
<div class="column">
<div class="columns is-multiline">
<div class="column is-6"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-6"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-6"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-6"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
</div>
</div>
</div>
</div>
</section>
</div>
5°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container has-text-centered">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="block"><img src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2"
alt=""></div>
<h3 class="title">Client: K-Hole</h3>
<p>We are constantly looking for new partners to migrate onto the Piper Net. The future of the
internet is here - venture towards it with Pied Piper!</p>
</div>
</section>
</div>
6°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container">
<div class="columns">
<div class="column is-half">
<h2 class="title">Our great clients</h2>
</div>
<div class="column is-half">
<div class="tabs">
<ul>
<li class="is-active"> <a href="#">Startups</a></li>
<li><a href="#">Corporations</a></li>
<li><a href="#">Individuals</a></li>
</ul>
</div>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
</div>
</div>
</section>
</div>
7°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container">
<div class="columns">
<div class="column is-half">
<h2 class="title">Great Companies that already use Piper Net.</h2>
</div>
<div class="column is-half">
<p class="block">We are constantly looking for new partners to migrate onto the Piper Net.
The future of the internet is here - venture towards it with Pied Piper!</p><a href="#">
Read more</a>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
<div class="column is-3"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a></div>
</div>
</div>
</section>
</div>
8°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container has-text-centered">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="columns is-multiline">
<div class="column is-6">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of the internet is here - venture towards it with Pied Piper!</p><a href="#">
Read case</a>
</div>
</div>
</div>
<div class="column is-6">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-6">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-6">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
</div>
<div class="buttons is-centered"><a class="button is-primary" href="#">View all PiperNet clients
</a>
</div>
</div>
</section>
</div>
9°
Code :
<div class="container is-fluid">
<section class="section">
<div class="container has-text-centered">
<h2 class="title">Great Companies that already use PiperNet</h2>
<div class="columns is-multiline">
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
<div class="column is-4">
<div class="card">
<div class="card-image"><a href="#"><img
src="https://bulma.dev/placeholder/pictures/bg_4-3.svg?primary=00d1b2" alt=""></a>
</div>
<div class="card-content">
<h5 class="title is-5">Pied Piper</h5>
<p class="block">We are constantly looking for new partners to migrate onto the PiperNet.
The future of
the internet is here - venture towards it with Pied Piper!</p><a href="#">Read case</a>
</div>
</div>
</div>
</div>
<div class="buttons is-centered"><a class="button is-primary" href="#">View all PiperNet clients
</a>
</div>
</div>
</section>
</div>