Teks area sering kita jumpai pada kolom komentar dimana user dapat menuliskan komentarnya pada area tersebut atau ada pula pada form registrasi dan masih banyak lagi tempat dimana teks area dapat kita jumpai. Pada tutorial kali ini saya akan mencoba membagi Cara Membuat Teks Area pada Bulma
Pada bulma framework kita akan disuguhi dengan kemudahan membuat teks area karena hanya dengan menambahkan beberapa class saja kita dapat membentuk teks area yang bagus, dan berikut langkah-langkah Cara Membuat Teks Area pada Bulma:
– Pertama, anda download file bulmanya di situs bulma itu sendiri dan tempatkan pada folder project yang teman-teman buat.
– Kedua, anda ketikan kode html di bawah ini:
<!DOCTYPE html>
<html>
<head>
<title>Teks Area pada Bulma</title>
<!--link ke css bulma-->
<link rel="stylesheet" href="bulma-0.4.0/css/bulma.css">
<!--link ke font-awesome-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<br>
<div class="columns">
<div class="column is-half is-offset-one-quarter">
<h1 class="title is-1 has-text-centered">Text Area</h1>
<div class="field">
<label class="label">Nama</label>
<p class="control">
<input class="input is-focused" type="text" placeholder="Focused input">
</p>
</div>
<div class="field">
<label class="label">Komentar</label>
<h1 class="title is-4">Isilah komentar dengan kata-kata bijak dan tidak menagndung provokasi</h1>
<p class="control">
<textarea class="textarea is-focused" placeholder="Focused textarea"></textarea>
</p>
</div>
</div>
</div>
</body>
</html>
Coba teman-teman lihat di dalam kode di atas terdapat class .field dan .control dimana masing-masing class tersebut memiliki fungsi masing-masing. Class .field itu sendiri berfungsi untuk membungkus class .control dan memberikan jarak keapada element selanjutnya. Sedangkan class .control adalah sebagai wrapper dari element input yang ada di dalam calss .control.
Lalu teman-teman buka di browser teman-teman maka tampilannya akan menjadi seperti berikut:
Dengan bulma kita dapat dengan mudah membuat suatu teks area untuk kolom komentar pada suatu website. Bagaimana teman-teman cukup mudahkan Cara Membuat Teks Area pada Bulma.
Sekian tutorial kali ini tentang pembahasan Cara Membuat Teks Area pada Bulma semoga bermanfaat bagi teman-teman.
The post Cara Membuat Teks Area pada Bulma appeared first on Kursus Website Terbaik.