ப்ளாக்கில் பல்பு (குண்டு பல்ப் ) மாட்டுவது எப்படி ??? ( Blog Light )

மின் தடையை போக்க

தமிழகத்தில் நிலவி வரும் கடும் மின் தடையால் பல பதிவர்களும் ப்ளாக் படிப்பவர்களும் படிக்க முடியாமல் போய் விடுகிறது ...
ஒரு நாளில் சில மணி  நேரங்களே பதிவர்கள் செலவிட முடிகிறது இதன் காரணமாக நாம் நம் பதிவர்கள் அனைவருமே தங்கள் ப்ளாக்-களில்
பல்பு மாட்டி வைத்தீர்கள் என்றால் வரும் பதிவர்களும் படிப்பவர்களும் வெளிச்சதோடு படித்து செல்ல முடியும் (ஹி ஹி ஹி )..

லைட்  பதிவின் மேலே (தலைப்புக்கு அருகில் ) எரிகிறது தொட்டு பார்க்கவும்  ..

DASH BOARD - DESIGN - ADD GEDJET / PAGE ELEMENT / ADD A WIDGET

SELECT HTML & JAVA SCRIPT AND PASTE THE CODE

<style type="text/css">
.light{ position:absolute; width:150px;
height:150px; top:10px; left:350px;
background:url
(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1SUjxnuKEOFdOY0BEuUNMGoI17jO8ZPPZNZAPoeQ1Bm6MU8UKXPuS-l3oivnmeYOr6Pb4ZoI4LnrrGiHbIr6S6rteIJ40Tbw-Ov_PTp9PPol6YiHiUoUNvoQtOudbUJO3MSuUl-EW6n5m/s1600/lightbulb.png)
no-repeat -150px 0;cursor:move; z-index:800;}
.light:hover { width:150px; height:150px;
 background:url
(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1SUjxnuKEOFdOY0BEuUNMGoI17jO8ZPPZNZAPoeQ1Bm6MU8UKXPuS-l3oivnmeYOr6Pb4ZoI4LnrrGiHbIr6S6rteIJ40Tbw-Ov_PTp9PPol6YiHiUoUNvoQtOudbUJO3MSuUl-EW6n5m/s1600/lightbulb.png) no-repeat 0 0;cursor:move;}
.warn{background:#FFF2F4 url
(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmBWe5Jf4cYFNSd9nEpr_4Ev6VIDmvKvkbTCcl5SG04_PIuAInRChWdoflN_CgMxTzUli0-BFapY6Zt4UphL5H9IpaTgdSiIe_R7z2T3fyl3VXCUH9R35aMWM6PrtalsVT4i-SngvaegY/s1600/nraw2.png)
center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #BE0000; background-position&lt;img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif' alt='' class='bhsmly'/&gt;px 50%; padding:1px 10px 20px 45px;
-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
</style>
<div class="light">
</div>

மேலும் சில முக்கியமான பயனுள்ள பதிவுகளை படித்து கொண்டிருக்கும் போது பவர் கட் ஆவதால் சில முக்கிய விசயங்களை வெளிச்சம் போட்டு

காட்ட ( பதிவில் முக்கியமானதை எழுதி  TEXT HERE என்னும் இடத்தில் PASTE செய்து விட்டு அனைத்தையும் COPY செய்து பின்னர் புதிய இடுகையை உருவாக்கி அதில்

என்னும் பட்டனை அழுத்தி ,அங்கு PASTE செய்யவும் )

<style type="text/css">
.md1 {
overflow:auto;width:503px;height:200px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(http://1.bp.blogspot.com/-GYEvx8OT5-k/Tv1otrpKJ-I/AAAAAAAACE8/2ZNywOeZfLQ/s1600/2.JPG) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ccc;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.md1:hover{
background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4NvIfOhdxG5nnNbJNuPifnomTXwaadx4pdUUUO4IrXxOPDv3xvRERLD3i_S-Fc4zhOEdpmxR4iGzzp_C34zwMfe2LoPXfbk4rNFtBahFD_k3WpQzNoTUWrNjJ0w4y2UNf578Z-tN5/s1600/light4.jpg) repeat-y top left;
color:#FEF9BF;
border : 1px solid #000;
border-left:20px solid #ccc;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 10px 10px 5px #888888;
}
</style>

 <div class="md1">

TEXT Here

</div>

சரி எப்படி இருக்கும் .................

லைட்-டை தொட்டு ( Touch The Mouse ) பார்க்கவும்

" என்று தணியும் மின்சார தாகம் "

                    - அடுத்த முதல்வர்

ஏதாவது லைட் எரியவில்லை என்றால் எலக்ட்ரீசியனை அணுகவும் ..

சந்தேகம் இருந்தால் கருத்துரையில்கண்டிப்பாக கேட்கவும் ..

நன்றி ...

மேலும் படிக்க

பரிச்சை தாளில் பதிவு எழுதலாம் ( Write Post Exam Paper )

வணக்கம்  நண்பர்களே இன்று பார்க்க போகும் பதிவு நீங்கள் எழுதும் பதிவுகளை  வித்தியாசமான முறையில் எப்படி காட்டலாம் ..
நம் பதிவுகள் படிப்பவரை சற்று மேலும் படிக்க வேண்டும் என துண்டும் என்பதில் சந்தேகம் இல்லை 
நீங்கள் செய்ய வேண்டியதெல்லாம்முதலில் பதிவை எழுதி முடித்து விடுங்கள்

முடித்து விட்டு எழுதிய பதிவை WORD DOCOUMENT -லோ அல்லது NOTE PAD -லோ PASTE செய்து வைத்து கீழே வரும் கோடிங்-களுக்கு ஏற்ற வாறு மாற்றி அமைத்துக் கொள்ளுங்கள் ... கொஞ்சம் கடினமான வேலையாகதான் இருக்கும்

சற்று சிரமம் பார்க்காமல் செய்தால் சில வடிவமைப்பில் பதிவுகளை பெற முடியும் .

<style>
.list {
color: #555;
padding: 0 !important;
font-family: courier, monospace;
border: 1px solid #dedede;
position: relative;
box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.list li {
list-style: none;
border-bottom: 1px dotted #ccc;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 5px 0 5px 40px;
text-transform: capitalize;
}
.list li:hover {
background-color: #eee;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
-ms-transition: 0.2s;
-o-transition: 0.2s;
}
.list li: last-child {
border-bottom: 0;
}
.list:before {
content: "";
border-left: 1px solid #ffaa9f;
border-right: 1px solid #ffaa9f;
width: 1px;
position: absolute;
height: 100%;
left: 25px;
}
</style>
<ul class="list">
<li>FIRST LINE...1</li>
<li>SECOND LINE...2</li>
<li>THIRD LINE...3</li>
</ul>
</div>
</div>

சரி செய்ய வேண்டியவை :

FIRST LINE SECOND LINE ,THIRD LINE என்னும் இடங்களில் முதல் வரி இரண்டாம் வரி ,மூன்றாம் வரி ஆகியவை கொடுத்து விடுங்கள் ...

மேலும் அடுத்த வரிகளுக்கு <li>TEXT HERE</li> மஞ்சள் நிறத்தில் உள்ள இடத்தில் சேர்த்து கொள்ளவும் ..

 

• தனக்குத் தெரிந்த விஷயங்களை மட்டுமே
• மனிதன் பேச ஆரம்பித்தால் உலகில்
• பூரண அமைதி ஏற்படும். - பெர்னாட்ஷா
• நன்றி

_______________________________________________________________

• அறிவு என்பது நம்முடைய ஒரு பகுதியாக
• இருக்கிறது. ஆனால், இதயம் நம்முடைய
• ஒவ்வொரு பகுதியாக இருக்கிறது- ரிரேஸ்
• வருகிறதென்று கவனி. அவன் எப்படிப்பட்ட
• வனென்று மிக நன்றாகத் தெரிந்து கொண்டு
• விடலாம். - கெதே
• அன்பு என்பது கண்ணுக்குத் தெரியாத நீரூற்று
• Join Google puls +
• Join Face Book
• Join this Blog
• Bye

<style type="text/css">

h4 {

  color: #cd0000;

  font-size: 14px;

  letter-spacing: -2px;

  text-align: left;

}

.list {

  color: #555;

  font-size: 22px;

  padding: 0 !important;

  width: 500px;

  font-family: courier, monospace;

  border: 1px solid #dedede;

}

.list li {

  list-style: none;

  border-bottom: 1px dotted #ccc;

  text-indent: 25px;

  height: auto;

  padding: 10px;

  text-transform: capitalize;

}

.list li:hover {

  background-color: #f0f0f0;

  -webkit-transition: all 0.2s;

  -moz-transition:    all 0.2s;

  -ms-transition:     all 0.2s;

  -o-transition:      all 0.2s;

}

.lines {

  border-left: 1px solid #ffaa9f;

  border-right: 1px solid #ffaa9f;

  width: 2px;

  float: left;

  height: 495px;

  margin-left: 40px;

}

</style>

<br />

<div class="lines">

</div>

<ul class="list">

<li>LINE...1</li>

<li> LINE...2</li>

<li> LINE...3</li>

<li> LINE...4</li>

<li> LINE...5</li>

<li> LINE...6</li>

<li> LINE...7</li>

<li> LINE...8</li>

<li> LINE...9</li>

<li>LINE...10</li>

<li>LINE...11</li>

</ul>

</div>

• மனிதன் பேச ஆரம்பித்தால் உலகில்
• பூரண அமைதி ஏற்படும். - பெர்னாட்ஷா
• நா‌ம் ந‌ம்முட‌ன் இரு‌க்கு‌ம் நப‌ர்க‌ளிட‌ம் அ‌ன்பு செலு‌த்த 
• முடியாம‌ல் போனா‌ல்,
• ந‌ம்மா‌ல் பா‌ர்‌க்க முடியாத கடவு‌ளிட‌ம் எ‌ப்படி
• அ‌ன்பு செலு‌த்த முடியு‌ம்? - ‌அ‌ன்னை தெரசா
• எ‌ல்லோருமே உலக‌த்தை மா‌ற்ற வே‌ண்டு‌ம்
• எ‌ன்றுதா‌ன் எ‌ண்ணு‌கிறா‌ர்கள‌ே‌த் த‌விர,
• ஒருவரு‌ம் த‌ன்னை எ‌ப்படி மா‌ற்‌றி‌க் கொ‌ள்ள
• வே‌ண்டு‌ம் எ‌ன்று எ‌ண்ணுவ‌தி‌ல்லை. - லியோ டோ‌ல்‌ஸ்டோ‌ய்
• நீ‌ங்க‌‌ள் வெ‌ற்‌றி பெ‌ற்றா‌ல் அதை‌ப் ப‌ற்‌றி
• யாரு‌க்கு‌ம் ‌விள‌க்க வே‌ண்டியது ‌இ‌ல்லை.
• ஆனா‌ல் ‌நீ‌ங்க‌ள் தோல்வி அடை‌ந்தா‌ல், அதை
• ப‌ற்‌றி ‌விள‌க்க அ‌ங்கே ‌நீ‌ங்க‌ள் இரு‌க்க‌க் கூடாது. - அட‌ல்‌ப் ஹ‌ி‌ட்ல‌ர்
• ஒருவ‌ர் தா‌ன் எ‌ப்போதுமே எ‌ந்த‌த் தவறு‌ம்
• செ‌ய்த‌தி‌ல்லை எ‌ன்று கூறுவாரேயானா‌ல்,
• அவ‌ர் எ‌ப்போது‌ம் பு‌திய ஒ‌ன்றை முய‌ற்‌சி‌த்த‌தி‌ல்லை
• எ‌ன்று அ‌‌ர்‌த்தமாகு‌ம். - ஐ‌ன்‌ஸ்டீ‌ன்
• வெ‌ற்‌றி பெற மூ‌ன்று வ‌ழிக‌ள்
• ஒ‌ன்று.. ம‌ற்றவ‌ர்களை ‌விட அ‌திகமாக தெ‌ரி‌ந்து கொ‌ள்ளு‌ங்க‌ள்.
• இர‌ண்டு.. ம‌ற்றவ‌ர்களை அ‌திகமாக ப‌ணியா‌ற்று‌ங்க‌ள்
• மூ‌ன்று... ம‌ற்றவ‌ர்களை ‌விட குறைவாக எ‌தி‌ர்பாரு‌ங்க‌ள்.
• -‌வி‌ல்‌லிய‌ம்‌ஸ் ஷே‌க்‌ஸ்‌பிய‌ர்
• ‌நீ‌ங்க‌ள் எ‌ப்போது‌ம் வா‌ழ்‌க்கை‌யி‌ல் 4 ‌விஷய‌ங்களை
• ம‌ட்டு‌ம் உடை‌த்து‌விடா‌‌தீ‌ர்க‌ள்.
• அதாவது, ந‌ம்‌பி‌க்கை, ச‌த்‌திய‌ம், உறவு, இதய‌ம்.
• ஏனெ‌னி‌ல், இ‌தி‌ல் எதையாவது உடை‌த்தா‌ல் அ‌திகமாக ச‌த்த‌ம் 
• கே‌ட்காது
• ஆனா‌ல் வ‌லி அ‌திகமாக இரு‌க்கு‌ம் - சா‌ர்ல‌ஸ்
• எ‌ல்லோரையு‌ம் ந‌ம்புவது ‌பய‌ங்கரமானது.
• ஆனா‌ல் யாரையுமே ந‌ம்பாம‌ல் இரு‌ப்பது ‌மிகவு‌ம்
• பய‌ங்கரமானது - அ‌‌ப்ரகா‌ம் ‌லி‌ங்க‌ன்.
• ‌நீங்க‌ள் எ‌ந்த ‌பிர‌ச்‌சினையையுமே ச‌ந்‌தி‌க்காம‌ல்
• அமை‌தியாக செ‌ன்று கொ‌ண்டிரு‌ந்தா‌ல்,
• உ‌ங்க‌ள் வா‌ழ்‌க்கை‌யி‌ல் தவறான பாதை‌யி‌ல் செ‌ன்று
• கொ‌‌ண்டிரு‌க்‌கி‌றீ‌ர்க‌ள் எ‌ன்று அ‌ர்‌த்த‌ம் - சுவா‌மி ‌விவேகா‌ன‌ந்த‌ர்.

 <style>.baris{color:#555;padding:0;
font-family:courier,monospace;
border:1px solid #ddd;position:relative;box-shadow:0 0 5px rgba(0,0,0,0.5);
background:#f3f3f3}.baris li{list-style:none;
border-bottom:1px dotted #ccc;overflow:hidden;white-space:nowrap;
text-overflow:ellipsis;
padding:5px 0 5px 40px;text-transform:capitalize}.baris li:hover{background-color:#FFF;
-webkit-transition:0.2s;-moz-transition:0.2s;-ms-transition:0.2s;-o-transition:0.2s;background-image:url(data:image/gif;base64,R0lGODlhBAABAIABAP+qn////yH5BAEAAAEALAAAAAAEAAEAAAIDRAIFADs=);background-repeat:repeat-y;background-position:25px 0}.baris li:last-child{border-bottom:0}.baris:before{content:"";border-left:1px solid #ffaa9f;border-right:1px solid #ffaa9f;width:1px;position:absolute;height:100%;left:25px}
.paragrap{padding:20px;font:italic 115%/1.5 Baskerville,"Palatino Linotype",serif;background-color:hsl(24,10%,90%);background-image:linear-gradient(hsla(210,50%,30%,.5) 1px,transparent 1px);background-image:-moz-linear-gradient(hsla(210,50%,30%,.5) 1px,transparent 1px);background-size:100% 1.5em;background-origin:content-box}</style>

<ul class="baris"><li>LINE 1</li><li>LINE 2</li><li>LINE 3 </li><li>LINE 4</li><li>LINE 5</li><li>LINE 6</li><li>LINE 7</li></ul>

மேலும் படிக்க

பிளாக்கர் : பதிவுகள் அனைத்தையும் ஒரே பக்கத்தில் காட்ட ( Blog Archive)

நாம் எழுதும் பதிவுகளில் அனைத்து பதிவுகளையும் காட்ட Blog Archive விட்ஜெட் தான் அனைத்து பதிவுகளையும் காடும் .. அதற்கு புது நிரலியாக பலர் பயன்படுத்தி வருகின்றனர் .. இன்று அனைத்து பதிவுகளையும் நாம் ஒரே பக்கத்தில் தோன்ற சில நிரலிகளை கொண்டு வந்தால் போதும் .. இது அருமையான வலைப்பதிவு(வலைப்பூ ) காப்பகம் .

மேலும் படிக்க

பிளாக்கர் : பதிவுகளின் பின்னணியில் பல வண்ணங்கள் மிளிர ( RainBow colors Post Backround )

நாம் எழுதும் பதிவுகள் படிப்பவர்களை எளிதில் கவர தெளிவாகவும் நன்றாக தெரியும் எழுத்துருக்களை தான் பயன்படுத்துவோம் . சில முக்கியமான குறிப்புகளை வேறு வண்ணங்களில் கொடுத்தால் தனியாக தெரியும் .. 

அதன் பின்னணியில் படங்களோ அல்லது வண்ணங்களோ அதிகமாக பயன்படுத்தி இருக்க மாட்டோம்

மேலும் படிக்க

பிளாக்கர் : மெகா மெனு பார்கள் (Blogger Mega Menu Bar )

அதிகமாக பெரிய சமூகவலைத்தளங்களில் காணப்படும்  மெகா மெனு பார்கள்
சாதாரணமான ப்ளாக்ஸ்போட் தளங்களில் நிருவுவதில்லை ..மெனுக்களை தொடும் போது அதன் முழு விளக்கம் அறிய முடியும் .. அதிகமான அளவு சி.எஸ்.எஸ். நிரல்களால் தயாரிக்கப்படும் இந்த மெனு பார்கள் மிகச் சிறந்த
மெனுக் களாக காணப்படுகிறது ... இணையத்தில் மிக பெரிய தொழில்நுட்ப தளமான

மேலும் படிக்க

பிளாக்கர் : மேற்கோள்களை பெட்டியில் காண்பிப்பது எப்படி ? (Shadow Box Blogger )

 

நாம் எழுதும் பதுவுகளில் சிலவற்றை தெளிவாக காண்பிக்க நினைப்போம் .

அவற்றை தனி மேற்கோள்களில் காண்பிப்போம் . இவற்றை எல்லை கோடுகளில்(BORDERS) கான்பிதொமென்றால் மிக அருமையாக இருக்கும் .. இதற்கு முன்னால் பார்த்த பதிவில் பல வகையான எல்லைக்கோடுகளை பார்த்தோம் .

மேலும் படிக்க

பிளாக்கர் : முகப்பு பக்கத்தில் பதிவுகளின் தலைப்பு மட்டும் (Post Title Only Home Page)

இலவச சேவையான பிளாக்கர் தளங்கள்  நாளுக்கு நாள் பெருகி கொண்டே 

வருகின்றன ... கோடிக்கணக்கான ப்ளாக் ஸ்போட் தளங்கள் நிமிடத்துக்கு நிமிடம் உருவாகி கொண்டே இருப்பதால் பிளாக்கர் தளமும் பல புது வசதிகளை கூகுள் பிளஸ்-வுடன் இணைந்து தந்து கொண்டுதான் இருக்கிறது . 

மேலும் படிக்க

HTML பகுதி 11- 3D லிங்க்-க்கு களை எப்படி கொடுக்கலாம் (3D links For Blogger)

HTML பகுதி பதினொன்றில் நாம் பார்க்க இருப்பது 3D வகை லிங்க்-குகளை நம் தளத்தில் எப்படி கொடுக்கலாம் .  அதிக சி.எஸ்.எஸ். கோடுகளை பயன்படுத்தி தான் இது போன்ற லிங்க் களை நாம் கொடுக்க முடியும் . ஹச்.டி.எம்.எல் மட்டும்
வைத்து இது போன்ற லிங்க் களை கொடுக்க இயலாது ..

சாதாரணமாக ஹச்.டி.எம்.எல் பயன்படுத்தி தான் லிங்க் கொடுத்திருப்போம்

இனி இது போன்ற 3D லிங்க்-குகள் நமக்கு உன்னதமான அனுபவத்தை கொடுக்கும் என்பதில் சந்தேகம் இல்லை .


கீழே கொடுக்கப்படும் HTML கோடிங்கை சிறிதும் மாற்றாமல் பதிவின் நடுவிலோ , அல்லது விட்ஜெட்-லோ வேறு இணையதளத்திலோ அல்லது உங்களுக்கு பயன் படும் இடங்களிலிலோ பயன் படுத்திக்கொள்ளும்

கவனிக்க : கோடிங் -களை HTML EDITER -ல் சென்று

NORMAL MODE-ல் கொடுக்காமல் HTML MODE-ல்

வைத்து PASTE செய்யவும் .

<style type="text/css">
#animationWrapper  {
  width:200px;
  font-family:&quot;proxima-nova-1&quot;

,"proxima-nova-2","Helvetica Neue","Arial"

,sans-serif;
  background:#222;
  padding:40px;
}

/* link which encapsulates SPANs */
#animationWrapper a {
  font-weight: 800;
  text-transform: uppercase;
  font-size: 42px;
  line-height: 0.9em;
  margin-bottom: 10px;
  display: block;
  position: relative;
  color: #E58;
  text-decoration: none
}

/* span and a - "workers" */
#animationWrapper a, #animationWrapper span {
  -webkit-transition: all 0.12s ease-out;
  -moz-transition: all 0.12s ease-out;
  -o-transition: all 0.12s ease-out;
  -ms-transition: all 0.12s ease-out;
  transition: all 0.12s ease-out;
}

#animationWrapper span {
  display: block;
  color: #555;
  text-shadow: 1px 1px black, 2px 2px black, 3px 3px black, 

4px 4px black, 5px 5px black, 6px 6px black, 7px 7px black, 8px 8px black;
}

/* special size for the first item */
#animationWrapper .span1 {
  font-size: 56px;
  line-height: 0.8em;
}

#animationWrapper a:hover {
    color: #fff ;
    top: -3px;
    left: -3px;
}

/* all spans become white */
#animationWrapper a:hover span {
  color:#fff;
}

/* different colors for each SPAN */
#animationWrapper a:hover .span1 {
    text-shadow: 1px 1px #58E, 2px 2px #58E, 

3px 3px #58E, 4px 4px #58E, 5px 5px #58E, 6px 6px #58E, 

7px 7px #58E, 8px 8px #58E, 9px 9px #58E, 10px 10px #58E, 11px 11px #58E;
}

#animationWrapper a:hover .span2 {
    text-shadow: 1px 1px #F90, 2px 2px #F90, 3px 3px #F90, 

 4px 4px #F90, 5px 5px #F90, 6px 6px #F90, 

7px 7px #F90, 8px 8px #F90, 9px 9px #F90, 10px 10px #F90, 11px 11px #F90;
}

#animationWrapper a:hover .span3 {
    text-shadow: 1px 1px #3C7, 2px 2px #3C7, 3px 3px #3C7, 

4px 4px #3C7, 5px 5px #3C7, 6px 6px #3C7, 

7px 7px #3C7, 8px 8px #3C7, 9px 9px #3C7, 10px 10px #3C7, 11px 11px #3C7;
}

#animationWrapper a:hover .span4 {
    text-shadow: 1px 1px #E58, 2px 2px #E58, 3px 3px #E58, 4px 4px #E58, 

5px 5px #E58, 6px 6px #E58, 7px 7px #E58, 

8px 8px #E58, 9px 9px #E58, 10px 10px #E58, 11px 11px #E58;
}

</style>

<div id="animationWrapper">
  <a href="EXAMPLEURL">

    <span class="span1">ஸ்டாலின்</span>
    <span class="span2">வெஸ்லி</span>
    <span class="span3">Effects</span>
    <span class="span4">WESMOB</span>
  </a>
</div>

சில திருத்தங்கள் :  

• width:200px- அகலத்தை தேவையான அளவு மாற்றிக் கொள்ளலாம் .

• EXAMPLE URL -தேவையான இணைப்புகள் ..  

 மேலும்  உதா நிறத்தில் உள்ள span1, span2, span3, span4

தனி தனி நிறங்கள்  ...

அதற்கான  கோடிங்க்ஸ் :  
(span1)

<div id="animationWrapper">
  <a href="EXAMPLEURL">

    <span class="span1">stalin</span>
  </a>
</div>

span2 :

<div id="animationWrapper">
  <a href="EXAMPLEURL">

   
    <span class="span2">wesley</span>
  </a>
</div>

span 3  :

<div id="animationWrapper">
  <a href="EXAMPLEURL">
    <span class="span3">Effects</span>
  </a>
</div>

span 4  :

<div id="animationWrapper">
  <a href="EXAMPLEURL">
    <span class="span4">WESMOB</span>
  </a>
</div>

சரி எப்படி இருக்கும் இந்த 3D இணைப்புகள்: 

WESMOB

நன்றி 

மேலும் படிக்க

படங்களின் வட்ட தொடு உணர்வு : HTML பகுதி பத்து

நாம் பதிவுகளின் நடுவிலோ அல்லது மற்ற இடங்களிலோ படங்களை இணைக்கும் போது அதற்கு தொடு உணர்வு எதுவும் கொடுத்திருக்க மாட்டோம் .

மேலும் படிக்க

பிளாக்கர் : செங்குத்தாக விரியும் மெனு பார்கள் ( Expanding Vertical Menu )

பல வகையான மெனு பார்கள் பார்த்துக்கொண்டு இருக்கிறோம் . 

அந்த  வரிசையில் இன்று நாம் பார்க்க போவது .. பிளாக்கர் தளங்களுக்கு தேவையான ஒரு வித்தியாசமான மெனு பார் நீங்கள் பிடித்திருந்தால் உங்கள் தளத்தில் பயன்படுத்தி பார்த்து விட்டு சொல்லுவும் . 

மேலும் படிக்க

பிளாக்கர் : வலைப்பூக்களில் நிலையான மெனு பார்கள் ( Fixed menu For Blogger )

வலைப்பதிவு (வலைப்பூ )வுக்கு வருபவர்கள் அடுத்த பக்கங்களுக்கு செல்ல துணை புரிவது இந்த மெனு பார்கள் தான் ..இந்த மெனு பார்களில் வகைகள் தனித்தனியாக பிரிக்க பட்டிருக்கும் .. மேலும் அவர்களை பற்றி ,அவர்களை தொடர்பு கொள்ளும் பக்கங்கள் ஆகியவையும் ,பேஸ் புக் ,ட்விட்டர் , போன்ற பக்கங்களின் இணைப்பையும் இந்த மெனு பார்களில் கொடுத்து இருப்பார்கள் . 

மேலும் படிக்க

பிளாக்கர் : SHOW / HIDE விட்ஜெட்

வலைப்பூக்களில் (வலைப்பதிவு ) சென்றவுடனே பதிவு ஒரு பக்கம் இருக்கும் .

மற்றவை சில பக்க உறுப்புகள் இருக்கும் .அதாவது கேஜெட் அல்லது விட்ஜெட் என்று அழைக்கப்படுவது ..

மேலும் படிக்க

HTML பகுதி 9 - தானாக தட்டச்சு செய்யும் எழுத்துக்கள்

HTML பகுதி ஒன்பதில் உங்களை சந்திப்பதில் மிக்க மகிழ்ச்சி ... சில தளங்களில் காணப்படும் சுவாரஸ்யமான ஹச்.டி.எம்.எல். முயற்சி செய்து பார்க்க வேண்டும் என்றே இதை சொல்கிறேன் .

மேலும் படிக்க