Headlines News :
Home » » Membuat Macam Bingkai/Border Tulisan

Membuat Macam Bingkai/Border Tulisan

Written By Rewin Satria on Senin, 11 Februari 2013 | 20.14



Bagaimana membuat bingkai/border tulisan pakai script berikut ini :

Script 1

<div style="border: 1px solid #CCC; margin: 10px 0px; padding: 10px; width: auto; height: auto; background-color:#EFEFEF; text-align: center;">Tulisan temen-temen yang akan ditampilkan disini</div>


Tulisan temen-temen yang akan ditampilkan disini

Keterangan: Border: 1px solid #CCC, berarti ketebalan garis (border) adalah 1px dengan warna abu-abu (mengenai kode warna dapat dilihat disini). Margin: 10px 0px, berarti margin atas-bawah 10 px dan margin kiri-kanan 0 px. Padding: 10px, berarti jarak tulisan ke border adalah 10px. Perintah auto pada width dan height supaya lebarnya mengikuti lebar kolom yang tersedia, sedangkan tingginya mengikuti isi (tulisan) yang dimasukkan kedalamnya. Kamu bisa merubah perintah auto kedalam bentuk pixel, misalnya: 100px. Background-color:#EFEFEF, berarti kotak berwarna abu-abu. Jika ingin dihilangkan warnanya, ganti kode #EFEFEF dengan none atau hapus perintah background-color berikut kode warnanya. Text-align: left, berarti tulisan dalam bentuk rata kiri. Jika kamu ingin mengubahnya, ganti saja left-nya dengan right, center, atau justify (rata kanan = right, rata tengah = center, dan rata kiri-kanan = justify).



Script 2

<textarea rows="5" cols="50">Tulisan yang temen-temen ingin tampilkan disini</textarea>





Script 3

<blockquote class="tr_bq" style="-webkit-box-shadow: rgb(204, 204, 204) 0px 5px 15px; background-color: #ffffcc; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; border-top-left-radius: 15px; border-top-right-radius: 15px; border: 2px dotted rgb(255, 204, 102); box-shadow: rgb(204, 204, 204) 0px 5px 15px; color: #6e6e6e; font-family: Georgia, 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif; font-size: 14px; height: auto; line-height: 19.600000381469727px; padding: 10px; width: 431.20001220703125px;">
Tulisan Sobat</blockquote>
Tulisan Sobat






Script 4

<div style="overflow:auto; border: 1px solid #CCC; margin: auto; padding: 3px; width: 95%; height: 100px; background-color: #49B2D6; text-align: justify;">Tulisan yang temen-temen ingin tampilkan disini</div>


Tulisan yang temen-temen ingin tampilkan disini



Script 5

<font style="border: 2px solid red; display: block; padding: 3px;">Teks yang ingin diberi border</font>

Teks yang ingin diberi border



Script 6
<font style="border: 2px dashed purple; display: block; padding: 3px;">Teks yang ingin diberi border</font>

Teks yang ingin diberi border



Script 7

<font size="15" style="background: #222; color: lime; border: 2px outset orange; padding: 3px; display: block;">Teks Yang Dihiasi</font>

Teks Yang Dihiasi



Script 8

<div style="background:green;border:1px solid #000; padding:6px; margin-left:20px"> Ini adalah text anda </div>


Ini adalah text anda



Script 9

<div style="border: 4px double #000000; background-color:#00CCFF; padding: 5px; width: auto;"> Tulisan,gambar,maupun kode script </div>


Tulisan,gambar,maupun kode script



Script 10

<div style="border: 4px groove #000000; background-color:#00CCFF; padding: 5px; width: auto;"> Tulisan,gambar,maupun kode script </div>


Tulisan,gambar,maupun kode script





Script 11

<div style="width:200px;height:100px;border:6px outset orange;">
Tulisan
</div>




Tulisan  




Script 12

<div style="width:200px;height:100px;border:6px double orange;">
Tulisan
</div>




Tulisan



Colour Code : Here or Here


Masih Terus Update................
Share this article :

0 komentar:

Speak up your mind

Tell us what you're thinking... !

Total Tayangan Laman

Arsip Blog

Popular Posts

 
Support : Creating Website | Rewin Template | Download Template
Proudly powered by Blogger
Copyright © 2050. Indonesia get power - All Rights Reserved
Original Design by Creating Website Modified by Rewinsatria