Norman & Memey

Bukan nk mengumpat atau mengata dua pasangan xbahagia.. tu dier punye pasal la yer..

tapi masa tgh2 surf internet saya jumpa dua perkara yg berkaitan ngan dua org selebriti ni
dan yang menarik perhatian saya..nak tau ape dier

saya jumpe game main tendang2 dua org ni, saya dah tendang 2,3kali dah..
game yg ringkas buat melepaskan tensen atau geram kat diorang..kalau nk main sila kan main kat bawah..

tendang norman

tendang memey

jumpe kat cuiit

Mencari ayat tersembunyi

Cuba cari ayat tersembunyi kat bawah, kalu jumpe saya bg seposen..hehe

sebelum itu, tolong guna firefox yer sbb ie xjadi ngan trick ni

Lorem ipsum dolor sit amet, consectetur adipiscing Adakahelit. Mauris lacus sem, gravida sed, congue et, Anda sagittis sit amet, sapien. Maecenas feugiat elit ac nunc. Sed turpis diam, imperdiet eget, condimentum ut, mattis nec, dui. Cras vel urna ut nisl porttitor Seorang vehicula. Mauris rutrum tellus a nunc. Sed purus YAng sapien, vulputate posuere, auctor in, malesuada vel, leo. Curabitur sodales iaculis ante. Nulla Baikaccumsan vestibulum felis. Vivamus commodo. Sed non eros sit amet sem cursus tincidunt. Integer blandit vulputate Hati? sem. Etiam dignissim sodales nisi.

Tak jumpe, ke dah pening...bagaimana kalu kamu highlight ayat kat atas..sudah nampak?
bagaimana saya membuat...anda ingin tahu..jom kita ke sebalik tabir

Macam biase, mula2

Seperti biasa, login ke Blogger, masuk ke Layout --> Edit HTML

Cari kod ini</head>, guna CTRL+F utk lebih senang...

kedian masukkan kod di bawah diatasnye

<style type='text/css'>
#container { width:600px;margin:10px auto; }
#logo img { border:none; }
#ie { display:none; }
p { font: normal normal 14px/150% Verdana, Arial, Helvetica, sans-serif; }
p::selection { background:#000;color:#000; }
p::-moz-selection { background:#000;color:#000; }
p span::selection { background:#fff;color:#000; }
p span::-moz-selection { background:#fff;color:#000; }
</style>

<!--[if IE 7]>
<style type="text/css">
#ie { display:block; }
</style>
<![endif]-->

dan untuk membuat posting ayat tersembunyi macam kat atas, kamu kena buat macam ni

<div id="container">
<p class="hide"> Ayat yang ingin disembunyikan <span> Yang nak ditunjuk </span> Ayat yang ingin disembunyikan </p></div>

itu saje...sebaiknyer gunakan bahagian HTML berbanding Compose kerana lebih mudah untuk melihat kod ketika membuat posting ini.

sumber : CSS Tricks

secret msg

Cuba cari ayat tersembunyi kat bawah, kalu jumpe saya bg seposen (tipu jer ni)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lacus sem, gravida sed, congue et, Anda sagittis sit amet, sapien. Maecenas feugiat elit ac nunc. Sed turpis diam, imperdiet eget, condimentum ut, mattis nec, dui. Cras vel urna ut nisl porttitor Seorang vehicula. Mauris rutrum tellus a nunc. Sed purus YAng sapien, vulputate posuere, auctor in, malesuada vel, leo. Curabitur sodales iaculis ante. Nulla Baikaccumsan vestibulum felis. Vivamus commodo. Sed non eros sit amet sem cursus tincidunt. Integer blandit vulputate Hati sem. Etiam dignissim sodales nisi.

Tak jumpe, ke dah pening...bagaimana kalu kamu highlight ayat kat atas..sudah nampak?

Menghilangkan "dotted line" pada link

Kalau kita perhatikan, bila kita menggunakan mozilla firefox (dgn ie7 xde plak rsnyer) klik je link mesti kuat dotted line di sekitar link tersebut...bukan link sahaja, gambar, tajuk entry dan sebagainya mesti kuar benda tu..ape??xtahu yg mana satu..cuba tgk gambar kat bawah...sudah perasan?!!

sebelum

selepas

Tak mengganggu pun tp bg sape2 yg xmao tgk dotted link 2 bleh la ikut trick kat bawah yer...

Seperti biasa, login ke Blogger, masuk ke Layout --> Edit HTML

Cari kod ini]]></b:skin>, guna CTRL+F utk lebih senang...

kedian masukkan kod di bawah diatasnye

a:focus {
outline: none;
}

dah siap, mudah saje kan...

walaubagaimanapun, dotted line 2 membantu kita mengenalpasti link yg kita klik...pilihan ditangan anda..

sumber : css-tricks

CSS untuk paparan teks

Kalau kita melayari blog kekawan lain d internet yg mengajar cara untuk memaparkan code atau ape2 saje yg menarik..pasti kita perasan yg kod itu diletakkan dalam satu area yg berbeza agar ia tampil dalam bentuk yg menarik ....contohnye mcm kat bawah;

saya ada dalam kotak info

saya ada dalam kotak warning

saya ada dalam kotak download

saya ada dalam kotak alert

saya ada dalam kotak note

berminat nk membuatnya dalam blog, ikut cara berikut:-

• Seperti biasa, login ke Blogger, masuk ke Layout --> Edit HTML
• Cari kod ini ]]</b:skin> , guna CTRL+F utk lebih senang...
• Dah jumpe, pastekan kod di bawah kat atas ]]</b:skin>.
• #rec { margin:20px;padding:20px;}
.info {
border: 1px solid #4AB7FF;
font-size: 11px;
color: #191919;
background: #BFE5FF url(http://i190.photobucket.com/albums/z315/fyzue/info.gif) no-repeat 5px center;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
display: block;
font-weight: 400;
width: 85%;
}
.warning {
border: 1px solid #FF8888;
font-size: 11px;
color: #191919;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
background: #FFBFBF url(http://i190.photobucket.com/albums/z315/fyzue/warning.gif) no-repeat 5px center;
display: block;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
font-weight: 400;
width: 85%;
}
.download {
border: 1px solid #C2E069;
font-size: 11px;
color: #191919;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
background: #E5F2BF url(http://i190.photobucket.com/albums/z315/fyzue/download.gif) no-repeat 5px center;
display: block;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
font-weight: 400;
width: 85%;
}
.alert {
border: 1px solid #FFC875;
font-size: 11px;
color: #191919;
line-height: 125%;
background: #FFE5BF url(http://i190.photobucket.com/albums/z315/fyzue/alert.gif) no-repeat 5px 5px;
font-family: Verdana, sans-serif, "Courier New";
display: block;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
font-weight: 400;
width: 85%;
}
.note {
border: 1px solid #FFE375;
font-size: 11px;
color: #191919;
font-family: Verdana, "Times New Roman", Times, Georgia, serif;
line-height: 125%;
background: #FFF2BF url(http://i190.photobucket.com/albums/z315/fyzue/note.gif) no-repeat 5px center;
display: block;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
font-weight: 400;
width: 85%;
}
  
• 
• sekarang Save Template...
  

Untuk melihat samaada cara ini berjaya atau tidak...cuba buat posting baru

kat dalam post 2 cuba buat :-

contoh untuk kotak alert kena buat camni <div class="alert"> tulisan dibuat disini </div>

sudah fahamkan cara nak menggunakan kotak ini kan...untuk yg lain ikut kod dibawah;

<div class="info">

Maklumat Disini

</div>



<div class="download">

Download Disini

</div>



<div class="warning">

Amaran Disini

</div>



<div class="alert">

Perhatian Disini

</div>



<div class="note">

Nota Disini

</div>

Semoga blog anda lebih ceria

sumber : Mohamed Rias