Friday, January 27, 2012

HTML பகுதி எட்டு - சி.எஸ்.எஸ். பார்டர்கள் ப்ளாக்-க்கு எளிதில் ஒரே நொடியில் உருவாக்கலாம்



ஹச்.டி.எம்.எல். தொடரின் அடுத்த பாகம் முந்தைய பகுதி பயனுள்ளதாக இருந்திருக்கும் என்று நினைக்கிறேன் .

இந்த பகுதியில் நாம் பார்க்க போவது ஹச்.டி.எம்.எல்( HTML ) பார்டர்கள் அல்ல


சி.எஸ்.எஸ். (CSS BORDERS)பார்டர்கள்

இருதாலும்  சி.எஸ்.எஸ். பகுதியை பயன்படுத்தாமல் HTML ஐ மட்டும் பயன்படுத்தி இந்த எல்லைக்கோடுகள் உருவாக்க படுவதால் இது HTML பார்டர்கள் .


புள்ளியிட்ட எல்லைக்கோடுகள் :A DOTTED BORDER
<p style="border: 1px dotted rgb(0, 0, 0); padding: 3px;">TEXT HERE</p>


ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

மேலும் இந்த எல்லைக்கோடுகளுக்குள் எவ்வளவு வேண்டுமானாலும் எழுதிக்கொள்ளலாம் . 

1px - என்னும் இடத்தில் ( 2px,3px,4px ) பார்டர் இன்னும் அகலம் அதிகமாகும்

பார்டர் கட்டையாகும் .... குறைத்தால்(5px,4px,3px,2px,1px) ஒல்லியாகும் .

TEXT HERE - என்னும் இடத்தில் பார்டருக்குள் என்ன வர வேண்டுமோ அதைக்
கொடுத்து விடுங்கள் .
_________________________________________________________

கோடுகள் விட்டு விட்டு வரும் எல்லைக்கோடுகள் : A DASHED BORDER

<p style="border: 1px dashed rgb(0, 0, 0); padding: 3px;">TEXT HERE</p>

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

 ____________________________________________________________

தொடரும் எல்லைக்கோடுகள் : SOLID BORDER

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

<p style="border: 1px solid rgb(0, 0, 0); padding: 3px;">TEXT HERE</p>
 ____________________________________________________________

இரட்டை எல்லைக்கோடுகள் : DOBULE BORDERS , TWO BORDERS

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!


<p style="border: 3px double rgb(0, 0, 0); padding: 3px;">TEXT HERE </p>
 ____________________________________________________________

3D எல்லைக்கோடுகள் : GROOVE

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

<p style="border: 5px groove rgb(152, 191, 33); padding: 3px;">TEXT HERE</p>

 ____________________________________________________________

3D எல்லைக்கோடுகள்: RIDGE
.
ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

 <p style="border: 5px ridge rgb(152, 191, 33); padding: 3px;">TEXT HERE</p>
 ____________________________________________________________

3D எல்லைக்கோடுகள்: INSET

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!

 <p style="border: 5px inset rgb(152, 191, 33); padding: 3px;">TEXT HERE</p>
 ____________________________________________________________

3D எல்லைக்கோடுகள் : OUTSET

ஒரு முறை ஐன்ஸ்டினிடம் மூன்றாம் உலகப்போரில் எவ்விதமான ஆயுதங்கள் பயன்படுத்தப்படும் என்று கேட்கப்பட்டது. அதற்கு அவர் கூறினார், “ மூன்றாம் உலகப்போரைப் பற்றி என்னிடம் கேட்காதீர்கள். ஆனால் நான்காம் உலகப்போர் எவ்விதமான ஆயுதங்களால் இடப்படும் தெரியுமா? கற்களாலும் குச்சிகளாலும்!


<p style="border: 5px outset rgb(152, 191, 33); padding: 3px;">TEXT HERE</p>
 ____________________________________________________________

 எல்லைக்கோடுகள் பிடித்திருந்தால் கீழே அதன் கோடிங் கொடுக்கபட்டுள்ளது எடுத்து பயன் படுத்தவும்

நன்றி ....

4 comments:

  1. முதல் பதிவும் இந்த பதிவும் மிகவும் பயனுள்ளதாக உள்ளன ! தொடர்க ! பாராட்டுக்கள் ! நன்றி நண்பரே !

    ReplyDelete
  2. பயனுள்ள தொடர் நண்பா! தொடருங்கள்...

    ReplyDelete
  3. மிகவும் பயனுள்ள பதிவு.வாழ்த்துக்கள் சகோதரரே.

    ReplyDelete