Modèles de contenus

1°

Code :

<div class="container is-fluid">
    <section class="section">
      <div class="container has-text-centered">
        <div class="block"><img src="../../all-css/placeholder/icons/unicorn.svg" alt=""></div>
        <p>Our mission is not to outsell Hooli with a product like their latest Box 3. We are not
           in it for the money -
          we are in it to make the whole world decentralized. To give you control over your data.
           To change by the
          internet as we know it by integrating a very important feature into it - freedom.</p>
      </div>
    </section>
  </div>

---

2°

Code :

<div class="container is-fluid">
    <section class="section">
      <div class="container has-text-centered">
        <h2 class="title">Decentralized, secure, private.</h2>
        <div class="block"><img src="../../all-css/placeholder/icons/unicorn.svg" alt="">
          <img src="../../all-css/placeholder/icons/unicorn.svg"
            alt=""><img src="../../all-css/placeholder/icons/unicorn.svg" alt=""></div>
        <p>Our mission is not to outsell Hooli with a product like their latest Box 3. 
           We are not in it for the money -
          we are in it to make the whole world decentralized. To give you control over your data.
             To change by the
          internet as we know it by integrating a very important feature into it - freedom.</p>
      </div>
    </section>
  </div>

---

3°

Code :

 <div class="container is-fluid">
    <section class="section">
      <div class="container has-text-centered">
        <div class="level">
          <div class="level-item has-text-centered"><a href="#">
              <figure class="image is-128x128"><img
                  src="https://bulma.dev/placeholder/pictures/bg_square.svg?primary=00d1b2" alt="">
              </figure>
            </a></div>
        </div>
        <h2 class="title">Learn more about PiperNet</h2>
        <p>Our mission is not to outsell Hooli with a product like their latest Box 3.
           We are not in it for the money -
          we are in it to make the whole world decentralized. To give you control over your data. 
          To change by the
          internet as we know it by integrating a very important feature into it - freedom.</p>
      </div>
    </section>
  </div>

---

4°

Code :

<div class="container is-fluid">
    <section class="section">
      <div class="container has-text-centered">
        <h2 class="title">The New Internet</h2>
        <iframe src="https://www.youtube.com/embed/OtDxDvCpPL4" width="760" height="480" 
         style="height: 480px"
          allowfullscreen></iframe>
      </div>
    </section>
  </div>

---

5°

Code :

<div class="container is-fluid">
    <section class="section">
      <div class="container">
        <div class="columns is-vcentered">
          <div class="column is-6">
            <h2 class="title is-spaced">The New Internet</h2>
            <p class="subtitle">Our mission is not to outsell Hooli with a product like their 
             latest Box 3. We are not
              in it for the money - we are in it to make the whole world decentralized.</p>
          </div>
          <div class="column is-6">
            <iframe src="https://www.youtube.com/embed/OtDxDvCpPL4" width="600" height="338"
             style="height: 338px"
              allowfullscreen></iframe>
          </div>
        </div>
      </div>
    </section>
  </div>

---

6°

Code :

<div class="container is-fluid">
    <section class="section">
      <div class="container">
        <div class="columns is-vcentered">
          <div class="column is-6">
            <iframe src="https://www.youtube.com/embed/OtDxDvCpPL4" width="600" height="338"
               style="height: 338px" allowfullscreen></iframe>
          </div>
          <div class="column is-6">
            <div class="block">
              <figure class="image is-32x32"><img src="../../all-css/placeholder/icons/unicorn.svg"
                alt=""></figure>
            </div>
            <h5 class="title is-spaced is-5">Videos</h5>
            <p class="subtitle">Our mission is not to outsell Hooli with a product like their 
             latest Box 3. We are not
              in it for the money - we are in it to make the whole world decentralized.</p>
            <div class="buttons"><a class="button is-primary" href="#">Join us</a>
                <a class="button is-text" href="#">Watch more</a></div>
          </div>
        </div>
      </div>
    </section>
  </div>

---