Biasanya kalo kita menuliskan tentang tutorial blog maka akan banyak
kode script , php ,html atau kode xml yang kita tuliskan di didalam
postingan kita jika kita mengimginkan code-code tersebut berada didalam
kotak maka akan keliatan lebih menarik ,lebih cantik,lebih sedap
dipandang mata dan lebih rapi,untuk cara membuatnya ini ada beberapa
kode yang bang germo ulas :
Cara membuat postingan kode html dalam kotak
Contoh tampilan yang akan dihasillkan akan
seperti ini :
Isi dengan tulisan anda disini
Untuk variasi kode penulisannya sebagai berikut :
1. penulisan untuk tampilan Dashed Border
<div
style="border: 2px <span style=">#FF0000 solid; padding:
10px; background-lt;span >#FFCC00</span>; overflow: auto;
height: 50px; width: 300px; text-align: left;"> <span
>Masukkan tulisan anda disini</span> </div>
2. tampilan Dashed Border
<div
style="border: 2px <span style=">#FF0000 dashed; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda disini</span>
</div>
3.tampilan Border dengan scroll, lebar dan tinggi
<div
style="border: 2px <span style=">#FF0000 solid; padding:
10px; background-lt;span >#FFCC00</span>; overflow: auto;
height: 50px; width: 300px; text-align: left;"> <span
>Masukkan tulisan anda disini</span> </div>
4.untuk tampilan Solid Border
<div
style="border: 2px <span style=">#FF0000solid; padding: 10px;
background-lt;span >#FFCC00</span>; text-align: left;">
<span >Masukkan tulisan anda disini</span></div>
5.untuk tampilan Ridge Border
<div
style="border: 2px <span style=">#FF0000 ridge; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
6.tampilan Groove Border
<div
style="border: 2px <span style=">#FF0000 ridge; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
7.tampilan Inset Border
<div
style="border: 2px <span style=">#FF0000 inset; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
8.tampilan Outset Border
<div
style="border: 2px <span style=">#FF0000 outset; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
9.tampilan Double Border
<div
style="border: 2px <span style=">#FF0000 double; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
10.tampilan Dotted Border
<div
style="border: 2px <span style=">#FF0000 dotted; padding:
10px; background-lt;span >#FFCC00</span>; text-align:
left;"> <span >Masukkan tulisan anda
disini</span></div>
Posted By Hendrik Arranger
Bagi rekan2 yg mau bertanya, atau yg mau menggunakan jasa saya, baik itu di blog atau apa aja deh dpt menghubungi saya, dan dpt jg dgn cara jd Donatur dan atau like Blog ini demi kemajuan Blog ini juga. contact me
Thank You
0 Comments
