Beginilah Skrip Coding Untuk Proses Ketika Mau Meratakan Teks Pada Foundation

 Utility Class

1. Rata Kanan dan Kiri

Kita dapat membuat suatu elemen rata kanan atau kiri dengan menambahkan class .right dan .left. Untuk menetralkan kembali gunakan class .clearfix pada elemen yang membungkusnya.

Skrip float class.html

<div class="panel clearfix">

      <div class="label left">Label kiri</div>

      <div class="label right">Label kanan</div>

</div>

2. Tampilan Sudut

Sudut suatu elemen dapat diubah dengan menggunakan class .radius dan .round. Class ini dapat diterapkan pada label, panel, button, form dan sebagainya.

Skrip round radius.html

<div class="label round">Round label</div>

<div class="label radius">Radius label</div>

3. Perataan Text

Untuk mengatur perataan text dapat digunakan class .text-left, .text-right, .text-center dan .text-justify. Class-class tersebut digunakan untuk mengatur perataan text secara umum pada semua ukuran layar. Kita juga dapat mengatur perataan text pada ukuran layar tertentu saja dengan class-class seperti terlihat pada tabel berikut:

Skrip text align.html

<div class="panel">

      <p class="text-left">Text rata kiri Text rata kiri Text rata kiri Text rata kiri </p>

      <p class="text-center">Text rata tengah Text rata tengah Text rata tengah Text rata tengah</p>

      <p class="text-right">Text rata kanan Text rata kanan Text rata kanan Text rata kanan</p>

      < p class="text-justify">Text rata kanan kiri Text rata kanan kiriText rata kanan kiri Text rata                                                        kanan kiri</p>

</div>

Rekomendasi Artikel: cara membuat block grid di foundation!

4. Menyembunyikan Elemen

Suaru elemen dapat disembunyikan dengan menambahkan class .hide. Class tersebut sama dengan memberi properti display: none; pada CSS.

Skrip hide element.html

<div class=" .hide">

     Text ini akan disembunyikan

</div>

Share :