BloonOnline GoTemplatez VersiEdan
Facebook Twitter You Tube Friendfeed
Blog Seo Intermezo

Bingkai Untuk Sebuah Karya Puisi


Saya telah menyaksikan
Bagaimana keadilan telah dikalahkan
oleh para penguasa
dengan gaya yang anggun
dan sikap yang gagah
Tampa ada ungkapan kekejaman
diwajah mereka

Dengan bahasa yang rapi
mereka keluarkan keputusan-keputusan
yang tidak adil terhadap rakyat

Serta dengan budi bahasa yang halus
mereka saling membagi keuntungan
yang mereka dapat dari rakyat
yang kehilangan tanah dan ternaknya

Ya, semuanya dilakukan
sebagai suatu kewajaran

Demi Orang-Orang Rangkasbitung
W.S Rendra

 

Malam selalu sunyi, walaupun begitu tak terasa tangan dan pikiran mencoba menjelajahi segala kemungkinan, sampai berhenti saat tak ada lagi sudut kemungkinan dari setiap kemungkinan.

Bingkai untuk sebuah puisi ini, merupakan trik css yang masih merujuk kepada tulisan sebelumnya, yakni “ Membuat kata-kata bijak dengan bingkai – alert message “.

Di sini saya hanya mempermainkan background positionnya. jika pada tulisan kemarin, saya meletakan gambarnya di samping kiri.

background-position: 15px 50%; /* posisi gmabar */

15px = posisi gambar secara horizontal (antara kiri dan kanan)
50% = posisi gambar secara vertikal ( antara atas dan bawah ).

Maka untuk membuat bingkai puisi ini, saya meletakan gambarnya di ujung paling atas. maka coding css background position-nya seperti ini :

background-position: 50%  0px; /* posisi gmabar */

hingga meletakan gambar di tenggah-tengah ( 50%  secara horizontal ) dan menariknya di ujung paling atas ( 0px – nol secara vertikal ).

Dan ini merupakan kode keseluruhannya,

Ingat jika ingin menganti baris gunakan <br/> dan untuk menganti tag <p> ( paragraf ) - gunakan <br/><br/>  ( secara berulang-ulang ).

 

<p style="border-right: #ffd324 2px solid; padding-right: 5px; border-top: #ffd324 2px solid; padding-left: 5px; background: url(http://lh3.ggpht.com/jaloee/SJnkSrFjzrI/AAAAAAAACXw/l0Kv-9PRepQ/pin.png) #f3f0eb no-repeat 50% 0px; padding-bottom: 5px; margin: 10px auto; border-left: #ffd324 2px solid; width: 300px; padding-top: 20px; border-bottom: #ffd324 2px solid; text-align: center">

         

<br />Saya telah menyaksikan  

   

  <br />Bagaimana keadilan telah dikalahkan       
     <br />oleh para penguasa 
         

  <br /><br />dengan gaya yang anggun       
   <br />dan sikap yang gagah
      

</p>

*Gambar pin di atas saya pinjam dari webdesignerwall.com .

* dan saya pikir.. mungkin banyak cara lagi selain ini.

Related Posts

 

del.icio.us tags:
Page views this post: reader

20 komentar:

gus said...

ini kemarahan terhadap situasi sekitar yang dibungkus tutorial membuat bingkai ya. ? great destination Kang....

Kristina Dian Safitry said...

langsung kupraktekkan bang.berhasil! tralaaa.la..li..li...

firdaus.a said...

cikopayna deui kang?...

nuhun ah... permisiiii juma'ahan euy..

Loedin said...

Wow.... bikin suasana romantis nih nantinya

andi8lumut said...

pengen nyoba mas.

summer said...

mas, aku chodirin. aku mau tanya. maaf gak sesuai dengan postingan di atas. mas kan pernah ngirim template blogger "nyahoo" ke saya. nah.. udah saya pake di www.instrumentpoint.com
templatenya bagus banget. saya suka. tapi sayang kalo di internet explorer.. bagian "menu" yg di bawah header memanjang keluar dari batas normal. gimana cara mengatasinya mas?

kalo di firefox udah ok. bisa jalan normal.
thanks atas jawabannya..

apen said...

keren mas, tapi apen masih belum punya ide untuk posting ...

Oeoes said...

kang jaloe aku pesen puisinya satu

rezKY p-RA-tama said...

si ws rendra mang yahud dah bikin puisi

summer said...

waduh..lom dijawab nih..

JALOE said...

untuk mas summer sudah saya jawab via komen di blog-nya..

sorry telat..

summer said...

thanks mas.. udah berees sekarang. maaf merepotkan..

faisol said...

terima kasih sharing infonya...

salam,
achmad faisol
http://achmadfaisol.blogspot.com/

[kurni]Awan_cLIK3rz said...

wah ide yg cemerlang....
liat dech postinga puizi ku...
Its poem 4 u fren....
thanks

JoVie said...

lho..lho...
ini nulis puisi apa tutorial yah??
Puisinya mantep..tutornya juga mantep..jadi bingung pilih yang mana..

Panda PLUR said...

makasih suhu, daritadi puter2 akhirnya nemu juga :)

babeh said...

ga sia2, blogwalking hingga kesini...., banyak manfaat yang bisa diambil...., tks a lot....

chokichim said...

mas jaloee, akoe mo tanya kalo bingkai agak lebih kecil gimana?apa yang perlu dirubah..?terimakasih info-info mas sangat mendukung sekali..sukses selalu

JALOE said...

@chokichim

untuk lebar bingkai bisa di ganti dari nilai width: 300px;

Luvarazer said...

Makasi banged bang,dah gw coba n berhasil....cihuy

Post a Comment

" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah

Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"

Makacih Atas Komentar-Nya

 

Copyright 2009. Home | Serba Serbi Google | XHTML | CSS Design by Catalog-Tutorial