Cara menuliskan URL Backgroud Image

  Cara menuliskan URL Backgroud Image

Sebelum meneruskan mengikuti tips dan tricks ini perlu diketahui bahwa panduan ini akan bermanfaat ketika d’blogger punya keinginan untuk menuliskan URL background sebuah gambar pada sebuah syntax secara lengkap di halaman ketika posting kode HTML sehingga image yang kita buat dapat diakses dan dimanfaatkan oleh semua pengunjung. 

Perlakukan seperti dilakukan dengan pertimbangan daripada gambar yang kita buat dan miliki hanya sekedar jadi milik pribadi yang mubazir. Oleh karena itu jika anda mempunyai pemikiran untuk berbagi gambar, silahkan kembali untuk melanjutkan! 

 

Kekacauan yang terjadi ketika memposting syntax CSS yang melibatkan sebuah URL atau link image yang dipergunakan sebagai background, pasti banyak dialami d’blogger. 

 

Contoh Syntax dengan background-image dari sebuah URL

Dua contoh hasil posting di bawah ini akan memperlihatkan cara posting yang benar dengan hasil sempurna di halaman blog dan hasil lain yang terlihat amburadul dan biasanya banyak dialami d’blogger, sehingga seringkali link image akhirnya dipotong supaya posting tidak terlihat kacau. 

Hasil Posting URL Background Image Sempurna

#kandangkerbau{

        width:300px;

        height:200px;

        border:solid #000 4px;

        background:url(http://semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg) no-repeat;

}

Hasil Posting URL Background Image Kacau !

#kandangkerbau{

        width:300px;

        height:200px;

        border:solid #000 4px;

        background:url http://semuanyakomputer.blogspot.com/...) no-repeat;

}

Perhatikan URL hasil posting di atas! Contoh pertama yang sangat sempurna dengan URL sekaligus seluruh kode terlihat utuh, sedang contoh kedua hasilnya tampak hancur karena bagian belakang URL lenyap seperti habis digerogoti rayap. Cermati juga kode didepan http (tanda kurung buka) yang juga hilang tak berbekas. Dengan kondisi ini beberapa blogger akhirnya memotong bagian depan URL hingga posting menjadi seperti ini :

Posting dengan memotong URL Background Image

#kandangkerbau{

        width:300px;

        height:200px;

        border:solid #000 4px;

        background:url(......../images/kerbaudankawan2.jpg) no-repeat;

}

Tips dan Tricks Menuliskan URL Background Image

Ada dua yang bisa digunakan untuk menuliskan URL secara lengkap dengan hasil dihalaman blog tanpa cacat.

Cara Pertama

Cara pertama dilakukan dengan menambahkan kode " (petik dua) sebelum dan sesudah URL background.

#kandangkerbau{

        width:300px;

        height:200px;

        border:solid #000 4px;

        background:url("http://semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg") no-repeat;

}

Cara Kedua

Cara kedua dilakukan dengan mengganti kode // (setelah http:) dalam bentuk kode berbeda berupa // , hingga penulisan kodenya menjadi seperti ini :

#kandangkerbau{

        width:300px;

        height:200px;

        border:solid #000 4px;

        background:url(http://semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg) no-repeat;

}

Kedua cara di atas sudah terbukti sangat manjur dan jika anda akan menampilkan URL secara lengkap maka hasil penulisan yang terlihat di halaman posting akan 100% sempurna dengan fungsi kode tetap berjalan sebagaimana mestinya. Silahkan anda pilih cara yang termudah menurut anda.

Keterangan/Catatan:

1. Kode " (tanda petik dua) dapat diganti dengan ‘ (tanda petik satu).
2. Lakukan posting yang melibatkan kode HTML selalu menggunakan Mode Posting HTML (bukan Mode Posting VISUAL).

http://semuanyakomputer.blogspot.com/2012/03/cara-menuliskan-url-backgroud-image.html