Kebanyakan teks atau tulisan yang kita buat hampir selalu polos tak berbackground.
Sekali-kali kita tampilkan backgound pada tulisan atau kalimat yang kita buat agar
terlihat lebih menarik sekaligus untuk mengatasi kejenuhan.
Coba saja Anda lihat contohnya di bawah ini :
CONTOH 1 (SATU) :
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
CONTOH 2 (DUA) :
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Langkah membuat hal yang demikian adalah :
1. Lebih dahulu masuk ke Edit HTML.
2. Cari tag </head>
3. Copy kode berikut dan letakkan di atas / sebelum tag </head> ini.
<style type="text/css">
#div {
width:350px;
height:200px;
padding:5px;
border: 2px solid magenta;
background-origin:border-box;
background-image:url('URL Gambar Anda di sini');
-moz-background-size:100% 100%;
background-repeat:no-repeat;
background-position:left;
}
</style>KETERANGAN :
Atur width dan heightnya dengan ukuran yang Anda inginkan.
Aturlah ukuran dan warna bordernya.
Ganti juga gambarnya dengan gambar yang ingin Anda tampilkan.
Untuk penerapan pada kalimatnya, masukkan kode berikut ke dalam konten
Gadget HTML/JavaScript atau bisa juga ke dalam postingan Anda.
<div class id="div"> Letakkan kalimat yang Anda tulis di sini. </div>
KETERANGAN :
Masukkan kalimat yang ingin Anda tampilkan pada tempat yang tersedia.
Selamat mencoba dan tetap good luck!
0 komentar:
Posting Komentar