Monday, January 23, 2012

HTML பகுதி ஏழு - அழகான பார்டர்கள் உருவாக்க




ஹச்.டி.எம்.எல் ஏழாவது பகுதி இன்று நாம் கற்க போவது HTML எல்லை கோடுகள் . அதாவது பார்டர்கள் . நாம் சிலவற்றை எழுதும் போது அதை தனித்து காட்ட நினைப்போம் . அப்படிப்பட்டவைகளை நீங்கள் இது போன்ற பார்டர்களுக்கு உள்ளே கட்டலாம் . 


முதலில் சாதாரணமான ஹச்.டி.எம்.எல் பார்டர்கள் : 

Solid Border

<div style="width:200px;height:100px;border:1px solid blue;">
TEXT HERE
</div>

  • width - பார்டர் அகலத்தை கூட்டி குறைத்து கொள்ளலாம் .
  • height - பார்டர் உயரத்தை  கூட்டி குறைத்து கொள்ளலாம்.
  • TEXT HERE-என்னும் இடத்தில் பார்டருக்கு உள்ளே வரும் 
டெக்ஸ்ட் பகுதி .  
அதிகமாக  எழுத வேண்டுமானால் பார்டரின் அகலத்தையும்,உயரத்தையும் 
அதிகப்படுத்திக்கொள்ள வேண்டும் . 

பார்டரின் அகலத்தை அதிகப்படுத்த வேண்டுமானால் ,அதாவது பார்டர் 
கட்டை யாக border: 1px இதில்  1 என்பதை உங்கள் தேவைக்கு ஏற்றவாறு கூடிக்கொள்ளலாம்

இதன்  முடிவு :


     2012, டிசம்பர் 21ல்   
       உலகம் அழிகிறது?!


Dotted Border

<div style="width:200px;height:100px;border:2px dotted blue;">
TEXT HERE
</div>
இதன்  முடிவு :


      2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

Dashed Border

<div style="width:200px;height:100px;border:2px dashed blue;">
TEXT HERE
</div>


     2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

Outset Border

<div style="width:200px;height:100px;border:2px outset blue;">
TEXT HERE
</div>
இதன்  முடிவு :


      2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

Inset Border

<div style="width:200px;height:100px;border:2px inset blue;">
TEXT HERE
</div>

இதன்  முடிவு :



     2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

Grooved Border

<div style="width:200px;height:100px;border:2px groove blue;">
TEXT HERE
</div>
 இதன்  முடிவு :


    2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

Mixed Border

<div style="width:200px;height:100px;border-width:6px;border-color:blue;border-style:dotted dashed solid double;">
TEXT HERE
</div>
இதன்  முடிவு :

      
      2012, டிசம்பர் 21ல்    
     உலகம் அழிகிறது?!

 இன்னும் வெவ்வேறு வண்ணங்களிலிலும் 

சிஎஸ்எஸ் பார்டர்களை பற்றி அடுத்த பகுதியில் பார்போம் .

நன்றி ...

3 comments:

  1. அழகான பாடர்களை உருவாக்க நல்ல பதிவினை தந்தமைக்கு நன்றிகள்

    ReplyDelete
  2. விதவிதமான பார்டர்கள். மிக்க நன்றி நண்பரே!

    "2012, டிசம்பர் 21ல் உலகம் அழிகிறது?!"

    கட்டம் கட்டி பயமுறுத்துகிறீர்களே ! ஹா... ஹா...

    ReplyDelete