Saturday, July 10, 2021

Tulisan dalam kotak di Blog


Membuat tulisan dalam kotak

1. Masuk ke Blogger - Buat Entri Baru

2. Mulailah menetukan judul artikel dan lanjut membuat artikel pada mode Compose

3. Saat ingin memasukkan kode tulisan dalam kotak,masuk ke mode HTML dan pastekan kode script yang ingin dipasang pada postingan

4. Untuk melanjutkan menulis artikel,kembalikan ke mode Compose seperti pada no 2 dan lihat hasilnya jika berhasil akan ada kotak untuk menulis didalamnya

Setelah kita selesai membuat kotak tersebut beserta artikelnya silahkan teman Pratinjau dahulu dan jika sesuai harapan silahkan Publikasikan artikel yang teman buat tadi, tutorial diatas tentang memasang kode script pada postingan. Jika teman sudah mengerti cara memasangnya, kita lanjut pada jenis kotak tulisan/border.


Jenis Border dan Kode Script Untuk Tulisan
Ada berbagai jenis kotak yang unik untuk membuat tulisan pada kotak dan menarik untuk diterapkan agar setiap postingan yang membutuhkan border tersebut dapat terlihat menarik dan rapih,untuk jenis nya teman bisa lihat dibawah ini kode script nya juga sudah ada di dalam tiap kotak tingal dipraktekan saja yah.


Kotak Border berwarna Hijau
<div style="border: 3px #04B45F Double; padding: 10px;background-color:#FFFFFF; text-align: left;">  coba tulis </div>

Kotak background biru

<p style="border: 1px solid rgb(204, 204, 204); padding: 15px; display: block; background-color: #cfe2f3; text-align: center;"> ngescript </p>

Kotak biru Tua 

<p style="border: solid 1px #eceff5; background: #29447E; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: white; font-size: 18px">Coba coba</p>


Kotak abu melengkung

<p style="border: solid 1px #aaa; background: #ccc; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: black; font-size: 18px">ngescript</p>


Kotak Putus putus

<p style="border: dashed 2px #ee3f10; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #1a356e; font-size: 18px">Coba coba</p>


Kotak Kuning
<div style="border: 2px #006400 ridge; padding: 10px; background-color: GOLD; text-align: left;"> ngescript</div>

Kotak tabel 4
isi kotak1 isi kotak2
isi kotak2 isi kotak2
kode nya : 

<table border="1" style="width: 400px;">
<tbody>
<tr>
<td align="center">isi kotak1
</td>
<td align="center">isi kotak2
</td>
</tr>
<tr>
<td align="center">isi kotak2
</td>
<td align="center">isi kotak2
</td>
</tr>
</tbody></table>

width: 400px bisa disesuaikan

Kotak biru melengkung
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #a2c4c9; border-radius: 10px; border: 4px outset #fff; padding: 10px; t-align: left;">ngescript</div>






No comments:

Post a Comment

close