"സഹായം:പട്ടികകൾ" എന്ന താളിന്റെ പതിപ്പുകൾ തമ്മിലുള്ള വ്യത്യാസം

Schoolwiki സംരംഭത്തിൽ നിന്ന്
വ്യത്യാസം കാണൽവിക്കിഎഴുത്ത്
No edit summary
No edit summary
വരി 1: വരി 1:
==സ്പ്രെഡ് ഷീറ്റിനെ വിക്കി-പട്ടികകളാക്കാന്‍==
==സ്പ്രെഡ് ഷീറ്റിനെ വിക്കി-പട്ടികകളാക്കാന്‍==
ഓപ്പണ്‍‌ഓഫീസ്.ഓര്‍ഗ് കാല്‍ക്, ജിന്യൂമറിക്, എം.എസ്. എക്സല്‍ തുടങ്ങിയ സ്പ്രെഡ്ഷീറ്റ് വിവരങ്ങളെ വിക്കി-പട്ടികകള്‍ ആക്കിമാറ്റാന്‍ [http://people.fas.harvard.edu/~sdouglas/table.cgi ഈ താള്‍] കാണുക.
ഓപ്പണ്‍‌ഓഫീസ്.ഓര്‍ഗ് കാല്‍ക്, ജിന്യൂമറിക്, എം.എസ്. എക്സല്‍ തുടങ്ങിയ സ്പ്രെഡ്ഷീറ്റ് വിവരങ്ങളെ വിക്കി-പട്ടികകള്‍ ആക്കിമാറ്റാന്‍ [http://excel2wiki.net/ ഈ താള്‍] കാണുക.


== റ്റൂള്‍ബാറിന്റെ ഉപയോഗം ==
== റ്റൂള്‍ബാറിന്റെ ഉപയോഗം ==

13:11, 25 ഒക്ടോബർ 2009-നു നിലവിലുണ്ടായിരുന്ന രൂപം

സ്പ്രെഡ് ഷീറ്റിനെ വിക്കി-പട്ടികകളാക്കാന്‍

ഓപ്പണ്‍‌ഓഫീസ്.ഓര്‍ഗ് കാല്‍ക്, ജിന്യൂമറിക്, എം.എസ്. എക്സല്‍ തുടങ്ങിയ സ്പ്രെഡ്ഷീറ്റ് വിവരങ്ങളെ വിക്കി-പട്ടികകള്‍ ആക്കിമാറ്റാന്‍ ഈ താള്‍ കാണുക.

റ്റൂള്‍ബാറിന്റെ ഉപയോഗം

പ്രമാണം:MlToolbar.jpg

താങ്കള്‍ക്ക് മീഡിയാവിക്കി എഡിറ്റ് റ്റൂല്‍ബാര്‍ ഉപയോഗിച്ച് പട്ടികകള്‍ ഉണ്ടാക്കാവുന്നതാണ്. അവശ്യമായ കോഡുകള്‍ ഒരു പരിധി വരെ അത് സ്വയം സൃഷ്ടിച്ചുകൊള്ളും. ചിത്രത്തില്‍ വട്ടത്തില്‍ അടയാളപ്പെടുത്തിയിരിക്കുന്ന ബട്ടണ്‍ ആണ്‌ അതു ചെയ്യുന്നത്. തിരുത്തുന്ന ഘട്ടത്തില്‍ പട്ടിക സൃഷ്ടിക്കാന്‍ പ്രസ്തുത ബട്ടണ്‍ ഉപയോഗിക്കാവുന്നതാണ്‌.

സ്വതവേ, അത് താഴെപറയുന്ന കാര്യങ്ങള്‍ താളില്‍ ഉള്‍പ്പെടുത്തുന്നു 

{| class="wikitable"
|-
! തലക്കെട്ട് 1
! തലക്കെട്ട് 2
! തലക്കെട്ട് 3
|-
| വരി 1, കളം 1
| വരി 1, കളം 2
| വരി 1, കളം 3
|-
| വരി 2, കളം 1
| വരി 2, കളം 2
| വരി 2, കളം 3
|}

സമാന്തര രേഖകളുടെ (പൈപ്പ്, “||“) ഉപയോഗം

ഉപയോഗിക്കുക അതിന്റെ ഫലം <tr> എന്നായിരിക്കും ചരങ്ങള്‍ ചേര്‍ക്കാന്‍: എന്നുപയോഗിക്കുക, അതിന്റെ ഫലം <tr ചരങ്ങള്‍> ശ്രദ്ധിക്കുക:
  • <tr>റ്റാഗുകള്‍ <td> തുല്യമായി സ്വയം തുറക്കുന്നതായിരിക്കും
  • <tr>റ്റാഗുകള്‍ <td> തുല്യമായി സ്വയം അടയ്ക്കുന്നതായിരിക്കും

കളങ്ങള്‍

കളങ്ങള്‍ സൃഷ്ടിക്കാന്‍:

| style="color: yellow; background-color: green;" | പ്രോസസര്‍ വേഗത: <nowiki><span style="color: white;"></nowiki> 1.8 GHz <nowiki></span></nowiki> <br />
<nowiki>|}</nowiki> <br />
</tt> </p>

മുകളില്‍ കാണുന്ന വിന്യാസം ശ്രദ്ധിക്കുക, <nowiki>...</nowiki> റ്റാഗുകള്‍ ഉപയോഗിച്ച് പട്ടിക തുറക്കാനും ({|), അടയ്ക്കാനുമുള്ള വിന്യാസങ്ങള്‍ (|}) ചിത്രത്തിന്റെ പ്രദര്‍ശനം ([[), കണ്ണി, മുതലായവ പ്രവര്‍ത്തനരഹിതമാക്കിയിരിക്കുന്നു, . എല്ലാ വിക്കി, എച്ച്.റ്റി.എം.എല്‍ വിന്യാസങ്ങളും <nowiki>...</nowiki> റ്റാഗുകള്‍ക്കുള്ളില്‍ ചേര്‍ത്ത് പ്രവര്‍ത്തനരഹിതമാക്കേണ്ടതാണ്. ഈ വിന്യാസങ്ങള്‍ മറ്റൊരു പട്ടികയ്ക്കുള്ളിലാണങ്കില്‍ | (ലംബ വര), ! (ആശ്ചര്യചിഹ്നം) തുടങ്ങിയവയും <nowiki>റ്റാഗിനുള്ളിലായിരിക്കണം . വിന്യാസപ്പെട്ടിയ്ക്കുള്ളിലെ കോഡ് ബ്രൌസര്‍ കാണുന്ന വീതിക്കുള്ളിലേക്ക് സ്വയം മുറിച്ചു കാണിച്ചുകൊള്ളും.

ഏതൊരു | (ലംബ വര) അക്ഷരരൂപത്തിനും &#124; (HTML decimal entity code) ഉപയോഗിക്കാം, എല്ലാ ! (ആശ്ചര്യചിഹ്നത്തിനു) പകരം &#33; ഉപയോഗിക്കാം, { (വളയന്‍ ബ്രാക്കറ്റ്)നായി &#123; ഉപയോഗിക്കാവുന്നതാണ്. അതേപോലെ } നു പകരമായി &#125; ഉള്‍പ്പെടുത്താം. < എന്നതിനു പകരം &#60; h &lt; ഉപയോഗിക്കാം. ഇത്തരത്തില്‍ ഡെസിമലോ ഹെക്സാഡെസിമലോ ആയ കോഡുകള്‍ക്കായി, ഈ താള്‍ കാണുക. ഒരു വിക്കിചിത്രത്തിന്റെയും വിക്കിവിന്യാസം കാട്ടാനായി ചതുരബ്രാക്കറ്റ് [ കാണിക്കാന്‍ &#91; ഉപയോഗിക്കാം. ] കാണാനായി &#93; ഉപയോഗിക്കാവുന്നതാണ്. ഇത്തരത്തിലുള്ള കോഡുകള്‍ ഉപയോഗിക്കുമ്പോള്‍ നാം അവയുടെ ശരിക്കുമുള്ള പ്രവര്‍ത്തനം സാദ്ധ്യമല്ലാതെയാക്കുന്നു, അതുകൊണ്ട് അവ താളുകളില്‍ ദൃശ്യമാവുകയും ചെയ്യുന്നു.


നിര ഒന്നിന്റെ തലക്കെട്ട് നിര രണ്ടിന്റെ തലക്കെട്ട് നിര മൂന്നിന്റെ തലക്കെട്ട്
വരി ഒന്നിന്റെ തലക്കെട്ട് കളം 2 കളം 100
വരി A യുടെ തലക്കെട്ട് കളം B

സാധാരണ എച്ച്.റ്റി.എം.എല്‍ വിക്കിപീഡിയയില്‍ പ്രവര്‍ത്തിക്കുമെങ്കിലും, പ്രത്യേക വിക്കിവിന്യാസത്തില്‍ പട്ടികകള്‍ വരി്‍മ്മിക്കാന്‍ എളുപ്പവഴിയുണ്ട്. സമാന്തര ലംബ വിന്യാസം (|| അഥവാ പൈപ്പ്) എച്ച്.റ്റി.എം.എല്ലിനു സമമാണ്. എച്ച്.റ്റി.എം.എല്‍ അറിയാമെങ്കില്‍ ഇതു താങ്കള്‍ക്ക് എളുപ്പമായിരിക്കും.

  • മുഴുവന്‍ പട്ടികയും വളയന്‍ ബ്രാക്കറ്റിനും ({) പൈപ്പിനും ഉള്ളില്‍ നല്‍കാം. അതുകൊണ്ട് പട്ടിക തുടങ്ങാന്‍ {| എന്നും അവസാനിപ്പിക്കാന്‍ |} എന്നും കൊടുക്കുക. ഓരോന്നും പ്രത്യേകം പ്രത്യേകം വരികളിലായിരിക്കാന്‍ ശ്രദ്ധിക്കുക
{|
  പട്ടികയുടെ ഉള്ളടക്കം
|}
  • പട്ടികയ്ക്ക് തലക്കെട്ട് ആവശ്യമെങ്കില്‍ അതിനായി ഒരു വരി തുടങ്ങി പൈപ്പ് രൂപവും അധികചിഹ്നവും ചേര്‍ത്ത ശേഷം വശത്തായി തലക്കെട്ട് നല്‍കുക
{|
|+ തലക്കെട്ട്
  പട്ടികയുടെ ഉള്ളടക്കം
|}
  • പട്ടികയില്‍ പുതിയൊരു വരി സൃഷ്ടിക്കാന്‍ ലംബവരയ്ക്കൊപ്പം ഒരു ഹൈഫനും (-) കൂടെ ചേര്‍ത്താല്‍ മതിയാവും. ആ വരിയില്‍ വേണ്ട കളങ്ങള്‍ക്കായി പുതിയ വരിയില്‍ തുടങ്ങുക.
{|
|+ പട്ടികയുടെ തലക്കെട്ട്
|-
  കളത്തിനുള്ള എഴുത്തുകള്‍
|-
  കളത്തിനുള്ള എഴുത്തുകള്‍
|}
  • അടുത്ത വരിയിലെ കളങ്ങള്‍ തുടര്‍ച്ചയായി എഴുതാന്‍, ഒരു ലംബ വരയിട്ട് വേര്‍തിരിച്ച് എഴുതിയാല്‍ മതിയാവും:
{|
|+ പട്ടികയുടെ തലക്കെട്ട്
|-
| കളത്തിനുള്ള എഴുത്തുകള്‍
|-
| പട്ടികയുടെ അടുത്ത വരിയില്‍ വേണ്ട കളങ്ങള്‍
| അതേ വരിയില്‍ വേണ്ട കൂടുതല്‍ കളങ്ങള്‍
|}
  • ഒരേ വരിയില്‍ കൂടുതല്‍ കളങ്ങള്‍ ഒന്നെങ്കില്‍ കോഡില്‍ പുതിയ വരിയില്‍ ഒരു ലംബവരയിട്ടോ, അല്ലങ്കില്‍ അതേ വരിയില്‍ രണ്ട് ലംബവരകളിട്ടോ "||" ഉണ്ടാക്കാവുന്നതാണ്. രണ്ടിന്റേയും ഫലം ഒന്നായിരിക്കും
{|
|+ പട്ടികയുടെ തലക്കെട്ട്
|-
|കളം 1 || കളം 2 || കളം 3
|-
|കളം A 
|കളം B
|കളം C
|}
  • കോഡില്‍ ഒറ്റ ലംബവരയുപയോഗിച്ചു കളങ്ങള്‍ വേര്‍തിരിക്കാന്‍ ശ്രമിച്ചാല്‍ ആദ്യവരയ്ക്കു ശേഷമുള്ളത് ബാക്കിയുള്ള എഴുത്തുകളുടെ സ്വഭാവം നിര്‍ണ്ണയിക്കുകയും, അതിനു ശേഷമുള്ള കളങ്ങള്‍ എല്ലാം കൂടി ഒന്നായും കാണാനിടവരും
{| border="1"
|-
|എഴുത്തുരീതി നിര്‍വചനം (കാണാന്‍ കഴിയില്ല)|ഇതെല്ലാം |(ലംബവരകളടക്കം)|ഒരൊറ്റക്കളത്തില്‍ |ആയിരിക്കും
|-
|}

സാധാരണരീതിയില്‍ താങ്കള്‍ക്ക് ഇത് ഉപകാരപ്രദമായിരിക്കില്ല

ഇതെല്ലാം |(ലംബവരകളടക്കം)|ഒരൊറ്റക്കളത്തില്‍ |ആയിരിക്കും

എഴുത്തുരീതി നിര്‍വചനം ആവശ്യം വരുന്ന സന്ദര്‍ഭവുമുണ്ടായേക്കാം: 

{| border="1"
|-
|കളം 1 (യാതൊരു എഴുത്തുരീതി നിര്‍വചനവുമില്ല)
|-
|align="right" |കളം 2 (വലത്തേയ്ക്ക് ചേര്‍ത്തെഴുതുന്നു)
|-
|}
കളം 1 (യാതൊരു എഴുത്തുരീതി നിര്‍വചനവുമില്ല)
കളം 2 (വലത്തേയ്ക്ക് ചേര്‍ത്തെഴുതുന്നു)

ഇതോര്‍ക്കുക: കോഡില്‍ ഒരു വരിയില്‍ ഒന്നിലധികം ഒറ്റ ലംബവരകള്‍ ഉപയോഗിക്കാതിരിക്കുക!

  • ഒരു വരിയില്‍ നിരകളുടെ തലക്കെട്ട് വേര്‍തിരിച്ചെഴുതാന്‍ "|" എന്നതിനു പകരം "!" ഉപയോഗിക്കുന്നു, "||" എന്നതിനു പകരം "!!" ഉപയോഗിക്കുന്നു. തലക്കെട്ടിന്റെ കളങ്ങള്‍ സാധാരണ ബ്രൌസറിനനുസരിച്ച് വ്യത്യസ്തമായാവും ദൃശ്യവത്ക്കരിക്കുക. അവമിക്കവാറും കട്ടികൂടപ്പെട്ടും മദ്ധ്യഭാഗത്തായിട്ടും കാണാന്‍ കഴിയും.
{|
|+ പട്ടികയുടെ തലക്കെട്ട്
! ഒന്നാം നിരയുടെ തലക്കെട്ട് !! രണ്ടാം നിരയുടെ തലക്കെട്ട് !! മൂന്നാം നിരയുടെ തലക്കെട്ട്
|-
കളം 1 കളം 2 കളം 3 
|-
കളം A കളം B കളം C 
|}
  • പട്ടികയുടെ ഒരു വരി തലക്കെട്ടാണെങ്കില്‍ അത് തുടങ്ങുക "|" എന്നതിനു പകരം "!" എന്നായിരിക്കും. വിവരങ്ങളെ കുറിക്കാനുള്ള അടുത്ത കളങ്ങള്‍ കോഡില്‍ പുതിയ വരിയില്‍ തുടങ്ങുക.

{| 

|+ പട്ടികയുടെ തലക്കെട്ട്
ഒന്നാം നിരയുടെ തലക്കെട്ട് രണ്ടാം നിരയുടെ തലക്കെട്ട് മൂന്നാം നിരയുടെ തലക്കെട്ട് 
|-
! ഒന്നാം വരിയുടെ തലക്കെട്ട്
കളം 2 കളം 3 
|-
! A വരിയുടെ തലക്കെട്ട്
കളം B കളം C 
|}
  • വേണ്ട കാര്യങ്ങള്‍ നിര്‍വചിച്ചു കൊടുത്ത് കളങ്ങളുടേയോ, വരികളുടേയോ, പട്ടികയുടേതു തന്നെയോ സ്വഭാവം മാറ്റാവുന്നതാണ്. ഉദാഹരണത്തിന് പട്ടികയ്ക്ക് ബോഡര്‍ കൊടുക്കാവുന്നതാണ്.:
{| border="1"
|+ പട്ടികയുടെ തലക്കെട്ട്
ഒന്നാം നിരയുടെ തലക്കെട്ട് രണ്ടാം നിരയുടെ തലക്കെട്ട് മൂന്നാം നിരയുടെ തലക്കെട്ട് 
|-
ഒന്നാം വരിയുടെ തലക്കെട്ട് കളം 2 കളം 3 
|-
വരി A യുടെ തലക്കെട്ട് കളം B കളം C 
|}

പട്ടികയുടെ അന്തിമദൃശ്യം ഇപ്രകാരമായിരിക്കും:

പട്ടികയുടെ തലക്കെട്ട്
ഒന്നാം നിരയുടെ തലക്കെട്ട് രണ്ടാം നിരയുടെ തലക്കെട്ട് മൂന്നാം നിരയുടെ തലക്കെട്ട്
വരി ഒന്നിന്റെ തലക്കെട്ട് കളം 2 കളം 3
വരി A യുടെ തലക്കെട്ട് കളം B കളം C

പട്ടികയ്ക്കുള്ള നിര്‍വചനങ്ങളും, കളങ്ങള്‍ക്കുള്ള നിര്‍വചനങ്ങളും എച്ച്.റ്റി.എം.എലില്‍ ഉള്ളതു തന്നെയായിരിക്കും [1] കാണുക. എന്നിരുന്നാലും thead, tbody, tfoot, colgroup, col തുടങ്ങിയ പ്രയോഗങ്ങള്‍ മീഡിയവിക്കി അനുവദിക്കുന്നില്ല.


ഇത്തരത്തില്‍ വരിയും നിരയും ഉപയോഗിച്ച് കളങ്ങള്‍ക്ക് നിറം കൊടുത്തും മറ്റും ഓരോരുത്തരുടേയും ഭാവനയനുസരിച്ച് ഇതിനെ ഉള്ളടക്കം ഒന്നും ഇല്ലാതെ തന്നെ ഡയഗ്രം ആയും ഒക്കെ ഉപയൊഗപ്രദമായി ഉപയൊഗിക്കാന്‍ കഴിയും. അപ്‌ലോഡ് ചെയ്യുന്ന ചിത്രത്തിനേക്കാളും ഇത്തരത്തില്‍ സൃഷ്ടിക്കുന്ന ദൃശ്യം തിരുത്താന്‍ എളുപ്പമാണെന്നോര്‍ക്കുക. വോളീബോള്‍ എന്നതാളില്‍ വരിയും നിരയും ഉപയോഗിച്ച് വോളീബോള്‍ കോര്‍ട്ടിന്റെ ചിത്രം വരച്ചിരിക്കുന്നതു ശ്രദ്ധിക്കുക.

പട്ടികയില്‍ ഓരോ വരിയിലേയും കളങ്ങളുടെ എണ്ണം തുല്യമായിരിക്കണം, അതായത് പട്ടികയിലെ നിരകളുടെ എണ്ണം സ്ഥിരമായിരിക്കും. ശൂന്യമായ കളങ്ങള്‍ക്കുള്ളില്‍ സ്പേസ് നല്‍കാനുള്ള കോഡായ &nbsp; നല്‍കുന്നത് കളം കാണാന്‍ കഴിയും എന്നുറപ്പാക്കുന്നു. കളത്തിനുള്ളില്‍ ലംബ വര കാണണമെങ്കില്‍ <nowiki>|</nowiki> എന്നോ &#124; എന്നോ ഉപയോഗിക്കുക.

ഒരു പട്ടികയില്‍ കളങ്ങളുടെ വീതിയോ നീളമോ സാധാരണയില്‍ നിന്നും കൂട്ടുവാനുള്ള മാര്‍ഗ്ഗങ്ങളായി കോളംസ്പാന്‍ (colspan) അല്ലങ്കില്‍ റോസ്പാന്‍ (rowspan) ഉപയോഗിക്കാവുന്നതാണ് (സഹായം ഇംഗ്ലീഷ് വിക്കിപീഡിയയില്‍ നിന്നും). ഇപ്രകാരം ചെയ്യുന്നതുമൂലം ക്രമപ്പെടുത്തല്‍ (സോര്‍ട്ടിങ്) ശരിയായി പ്രവര്‍ത്തിക്കാതിരുന്നേക്കാം.

ഉദാഹരണങ്ങള്‍

ലളിതമായ ഉദാഹരണം

താഴെ കൊടുത്തിരിക്കുന്ന രണ്ടുരീതിയും ഒരേ പോലെയാവും പ്രത്യക്ഷപ്പെടുക. വരികളിലെ കളങ്ങളുടെ എണ്ണത്തിനനുസരിച്ചും, കളങ്ങളില്‍ ആവശ്യമുള്ള എഴുത്തിന്റെ ദൈര്‍ഘ്യം അനുസരിച്ചും അനുയോജ്യമായ മാര്‍ഗ്ഗം തിരഞ്ഞെടുക്കുക.

വിക്കി വിന്യാസം 

{| 
| A 
| B
|- 
| C
| D
|}

{| 
| A || B
|- 
| C || D 
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

A B
C D

ഗുണനപ്പട്ടിക

വിക്കി വിന്യാസം 

{| class="wikitable" style="text-align:center"
|+ഗുണനപ്പട്ടിക
|-
! &times; !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം (see: Help:User_style)

ഗുണനപ്പട്ടിക
× 1 2 3
1 1 2 3
2 2 4 6
3 3 6 9
4 4 8 12
5 5 10 15

നിറവും; ചരങ്ങളുടെ ഉപയോഗവും

കളങ്ങളുടെ പശ്ചാത്തലനിറവും, എഴുത്തിന്റെ നിറവും രണ്ടു തരത്തില്‍ നിര്‍വചിക്കാം, ആദ്യ രീതി കൂടുതല്‍ അനുയോജ്യം:

വിക്കി വിന്യാസം 

{| 
| style="background:red; color:white" | അമ്മ
| ഇല
| bgcolor="red" | <font color="white"> തറ </font>
| പറ
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

അമ്മ ഇല തറ പറ

ചരങ്ങളുടെ പൊതു ഉപയോഗത്തിലുള്ളതു പോലെ നിറങ്ങള്‍ മുഴുവന്‍ വരിക്കായോ, മുഴുവന്‍ പട്ടികയ്ക്കായോ വേണമെങ്കിലും നല്‍കാവുന്നതാണ്; ഒരു പ്രത്യേക വരി നിര്‍വചിക്കുവാനുള്ള ചരങ്ങള്‍ പട്ടികയുടെ നിര്‍വചനത്തെ അതിലംഘിക്കുന്നതായിരിക്കും. അതേപോലെ ഒരു പ്രത്യേക കളത്തിനുള്ള നിര്‍വചനം, അതുള്ള വരിയുടെ നിര്‍വചനത്തേയും അതിലംഘിക്കും.

വിക്കി വിന്യാസം 

{| style="background:yellow; color:green"
|- 
| അമ്മ || ഇല || തറ
|- style="background:red; color:white"
| പറ || പശു || ആന
|-
| stu || style="background:silver" | വീട് || പന
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

അമ്മ ഇല തറ
പറ പശു ആന
ഋഷി വീട് പന

താളിന്റെ പശ്ചാത്തലവുമായി പട്ടിക ചേര്‍ന്നു നില്‍ക്കണമെങ്കില്‍ style="background:none" എന്നോ style="background:transparent" എന്നോ ഉപയോഗിക്കുക (style="background:inherit" ഐ.ഇ.6 അടക്കം ചില ബ്രൌസറുകളില്‍ പ്രവര്‍ത്തിക്കില്ല.

കാണുക : style, background, list of colors, web colors

വീതിയും ഉയരവും

ഒരു വരിയുടേയോ പട്ടികയുടെ തന്നെയോ വീതിയും ഉയരവും നിര്‍വചിക്കാവുന്നതാണ്. ഓരോ കളത്തിന്റേയും വീതി പ്രത്യേകം പ്രത്യേകം പറഞ്ഞുകൊടുത്ത് നിരയുടെ വീതി നിര്‍വചിക്കാവുന്നതാണ്. ഒരു കളത്തില്‍ മാത്രം നിരയുടെ വീതിയോ വരിയുടെ ഉയരമോ പറഞ്ഞുകൊടുത്താലും മിക്കവാറും ഒരേ പോലെ പ്രവര്‍ത്തിക്കും എന്നാലും അത് ബ്രൌസറിനനുസരിച്ചാണെന്നോര്‍ക്കുക.

വിക്കി വിന്യാസം 

{| style="width:75%; height:200px" border="1"
|- 
| അമ്മ || ഇല || തറ
|- style="height:100px" 
| പറ || style="width:200px" |പശു || ആന
|-
| ഋഷി || വീട് || പന
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

അമ്മ ഇല തറ
പറ പശു ആന
ഋഷി വീട് പന

style="inline CSS" തുടങ്ങിയ കോഡിങ്ങുകള്‍ ചില ബ്രൌസറുകള്‍ക്ക് തിരിച്ചറിയാനേ കഴിയുകയില്ല എന്നോര്‍ക്കുക. പഴയ രീതികളായ width="75%" മിക്ക ബ്രൌസറുകളിലും പ്രവര്‍ത്തിക്കും എന്നോര്‍ക്കുക.

നിരയുടെ വീതി ക്രമപ്പെടുത്തല്‍

നിരയിലെ കളങ്ങളില്‍ വച്ച് ഏറ്റവും ദൈര്‍ഘ്യമുള്ള എഴുത്ത് നിരയുടെ വീതിയായി വരുന്നതിനപ്പുറം താങ്കളുടെ താത്പര്യപ്രകാരമുള്ള അളവുകള്‍ വേണമെങ്കില്‍ ഈ ഉദാഹരണം കാണുക. വീതിക്കനുസരിച്ച് എഴുത്തുകള്‍ മുറിഞ്ഞുപോകുന്നതു ശ്രദ്ധിക്കുക. 

{| border="1" cellpadding="2"
!width="50"|നിര
!width="225"|വലിയ നിര
!width="225"| വലിയ നിര
|-
| ദ്യോവിനെ വിറപ്പിക്കുമാ || വിളി കേട്ടോ മണിക്കോവിലില്‍ മയങ്ങുന്ന  ||  മാനവരുടെ ദൈവം
|-
| എങ്കിലുമതുചെന്നു || മറ്റൊലികൊണ്ടൂ പുത്രസങ്കടം സഹിയാത്ത || സഹ്യന്റെ ഹൃദയത്തില്‍
|}
നിര വലിയ നിര വലിയ നിര
ദ്യോവിനെ വിറപ്പിക്കുമാ വിളി കേട്ടോ മണിക്കോവിലില്‍ മയങ്ങുന്ന മാനവരുടെ ദൈവം
എങ്കിലുമതുചെന്നു മറ്റൊലികൊണ്ടൂ പുത്രസങ്കടം സഹിയാത്ത സഹ്യന്റെ ഹൃദയത്തില്‍

തലക്കെട്ടുകളില്‍ ഒറ്റയടിക്കു നല്‍കുന്നതല്ലാതെ നിരകള്‍ക്ക് വീതി പറഞ്ഞു കൊടുക്കുവാന്‍ നിരയിലെ ആദ്യകളത്തിനുള്ള വീതി പറഞ്ഞുകൊടുത്താല്‍ മതിയാവും: 

{| border="1" cellpadding="2"
|-
|width="100pt"| ഈ നിരയ്ക്ക് 100 ബിന്ദുക്കള്‍ വീതിയുണ്ട്
|width="200pt"| ഈ നിരയ്ക്ക് 200 ബിന്ദുക്കള്‍ വീതിയുണ്ട്
|width="300pt"| ഈ നിരയ്ക്ക് 300 ബിന്ദുക്കള്‍ വീതിയുണ്ട്
|-
| സുഖദാം || വരദാം || മാതരം
|}
ഈ നിരയ്ക്ക് 100 ബിന്ദുക്കള്‍ വീതിയുണ്ട് ഈ നിരയ്ക്ക് 200 ബിന്ദുക്കള്‍ വീതിയുണ്ട് ഈ നിരയ്ക്ക് 300 ബിന്ദുക്കള്‍ വീതിയുണ്ട്
സുഖദാം വരദാം മാതരം

നിരകള്‍ ക്രമപ്പെടുത്താനായും വീതി ഉപയോഗപ്പെടുത്താവുന്നതാണ്


രാജ്യം തലസ്ഥാനം
ഈജിപ്ത് കെയ്‌റോ
രാജ്യം തലസ്ഥാനം
ഫ്രാന്‍സ് പാരീസ്

ലംബമായുള്ള സ്ഥാ‍ന നിര്‍ണ്ണയം

സ്വതവേ പട്ടികയിലെ കളങ്ങളിലെ എഴുത്തുകള്‍ ലംബമായി നോക്കിയാല്‍ കളത്തിനുള്ളില്‍ മദ്ധ്യഭാഗത്തായിരിക്കും. ചിലപ്പോഴെങ്കിലും ഇത് കാണാന്‍ സുഖകരമായിരിക്കില്ല.

വരിയുടെ തലക്കെട്ട് ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു നല്‍കുന്ന വൃക്ഷങ്ങള്‍ കടയറ്റു നൊന്തു വീഴുമ്പോഴും, അച്ചില്ലയില്‍ ചുള്ളിനാരുകള്‍ പിണച്ചുള്ള കൊച്ചുനീഡത്തില്‍ പൊരുന്നിരിക്കും ചേക്കുപക്ഷികള്‍ ചിറകിട്ടടിച്ചു കേഴുമ്പൊഴും, തളിരിലകളുടെയിടയിലൂടൊളിഞ്ഞു നോക്കും പൂംചെറുതുകളടര്‍ന്നുവീണെല്ലാം നശിച്ചെന്നു കരളുരുകി മണ്ണോടു മാറണക്കുമ്പോഴും, പിന്നെയും പൊട്ടിവിടരും മുളകളെ കണ്ടു, മങ്ങിങ്ങു ചെറു ചകിരി നാരുകള്‍ കൊത്തുന്ന മഞ്ഞക്കിളികളെ കണ്ടുമെന്‍ മനസ്സിന്‍ മുറിപ്പാടുകള്‍ വേദന മറക്കുന്നു. ചെറിയ എഴുത്ത്.
വരിയുടെ തലക്കെട്ട് ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു നല്‍കുന്ന വൃക്ഷങ്ങള്‍ കടയറ്റു നൊന്തു വീഴുമ്പോഴും, അച്ചില്ലയില്‍ ചുള്ളിനാരുകള്‍ പിണച്ചുള്ള കൊച്ചുനീഡത്തില്‍ പൊരുന്നിരിക്കും ചേക്കുപക്ഷികള്‍ ചിറകിട്ടടിച്ചു കേഴുമ്പൊഴും, തളിരിലകളുടെയിടയിലൂടൊളിഞ്ഞു നോക്കും പൂംചെറുതുകളടര്‍ന്നുവീണെല്ലാം നശിച്ചെന്നു കരളുരുകി മണ്ണോടു മാറണക്കുമ്പോഴും, പിന്നെയും പൊട്ടിവിടരും മുളകളെ കണ്ടു, മങ്ങിങ്ങു ചെറു ചകിരി നാരുകള്‍ കൊത്തുന്ന മഞ്ഞക്കിളികളെ കണ്ടുമെന്‍ മനസ്സിന്‍ മുറിപ്പാടുകള്‍ വേദന മറക്കുന്നു. ചെറിയ എഴുത്ത്.

ഈ പ്രശ്നം പരിഹരിക്കാന്‍ valign="top" എന്ന് വരികളില്‍ കൊടുത്താല്‍ മതിയാവും (ഓരോ വരിയിലും കൊടുക്കേണ്ടി വന്നേക്കും) ഉദാഹരണം 

{| border="1" cellpadding="2"
|-valign="top"
|width="10%"|'''വരിയുടെ തലക്കെട്ട്'''
|width="70%"|ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു...
|width="20%"|ചെറിയ എഴുത്ത്.
|-valign="top"
|'''വരിയുടെ തലക്കെട്ട്'''
|ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു... 
|ചെറിയ എഴുത്ത്.
|}
വരിയുടെ തലക്കെട്ട് ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു നല്‍കുന്ന വൃക്ഷങ്ങള്‍ കടയറ്റു നൊന്തു വീഴുമ്പോഴും, അച്ചില്ലയില്‍ ചുള്ളിനാരുകള്‍ പിണച്ചുള്ള കൊച്ചുനീഡത്തില്‍ പൊരുന്നിരിക്കും ചേക്കുപക്ഷികള്‍ ചിറകിട്ടടിച്ചു കേഴുമ്പൊഴും, തളിരിലകളുടെയിടയിലൂടൊളിഞ്ഞു നോക്കും പൂംചെറുതുകളടര്‍ന്നുവീണെല്ലാം നശിച്ചെന്നു കരളുരുകി മണ്ണോടു മാറണക്കുമ്പോഴും, പിന്നെയും പൊട്ടിവിടരും മുളകളെ കണ്ടു, മങ്ങിങ്ങു ചെറു ചകിരി നാരുകള്‍ കൊത്തുന്ന മഞ്ഞക്കിളികളെ കണ്ടുമെന്‍ മനസ്സിന്‍ മുറിപ്പാടുകള്‍ വേദന മറക്കുന്നു. ചെറിയ എഴുത്ത്.
വരിയുടെ തലക്കെട്ട് ഒരു വലിയ എഴുത്ത്. ഉച്ചക്കൊടുംവെയിലില്‍ നല്‍ത്തണലു നല്‍കുന്ന വൃക്ഷങ്ങള്‍ കടയറ്റു നൊന്തു വീഴുമ്പോഴും, അച്ചില്ലയില്‍ ചുള്ളിനാരുകള്‍ പിണച്ചുള്ള കൊച്ചുനീഡത്തില്‍ പൊരുന്നിരിക്കും ചേക്കുപക്ഷികള്‍ ചിറകിട്ടടിച്ചു കേഴുമ്പൊഴും, തളിരിലകളുടെയിടയിലൂടൊളിഞ്ഞു നോക്കും പൂംചെറുതുകളടര്‍ന്നുവീണെല്ലാം നശിച്ചെന്നു കരളുരുകി മണ്ണോടു മാറണക്കുമ്പോഴും, പിന്നെയും പൊട്ടിവിടരും മുളകളെ കണ്ടു, മങ്ങിങ്ങു ചെറു ചകിരി നാരുകള്‍ കൊത്തുന്ന മഞ്ഞക്കിളികളെ കണ്ടുമെന്‍ മനസ്സിന്‍ മുറിപ്പാടുകള്‍ വേദന മറക്കുന്നു. ചെറിയ എഴുത്ത്.

സ്ഥാനനിര്‍ണ്ണയം

വേണമെങ്കില്‍ പട്ടികയുടേയോ, ഒരു വരിയുടെ ഉള്ളടക്കത്തിനേയോ, അല്ല ഒരു കളത്തിന്റെ ഉള്ളടക്കത്തിനു മാത്രമോ ആയി സ്ഥാനം പറഞ്ഞുകൊടുക്കാന്‍ കഴിയും. ഇതെല്ലാം വ്യത്യസ്ത രീതികളിലാവും ചെയ്യേണ്ടി വരിക. ഒരു കാരണവശാലും പട്ടിക "float" ആയി നല്‍കരുത്. താളിന്റെ ദൃശ്യരൂപത്തെ അത് ദോഷകരമായി ബാധിക്കും.

അധിക വിവരങ്ങള്‍

ഇവിടെ പട്ടികകളില്‍ കൂടുതല്‍ സൌകര്യങ്ങള്‍ ചേര്‍ക്കാനുള്ള കുറെക്കൂടി സങ്കീര്‍ണ്ണമായ ഉദാഹരണങ്ങള്‍ കാണം. ഉള്ളടക്കം ആവശ്യാനുസരണം ക്രമപ്പെടുത്തല്‍ (സോര്‍ട്ടിങ്) കോള്‍സ്പാനോ, റോസ്പാനോ ഉണ്ടെങ്കില്‍ ശരിയായി പ്രവര്‍ത്തിക്കില്ലന്നോര്‍ക്കുക.

താങ്കള്‍ക്ക് താങ്കളുടെ പട്ടികകളില്‍ ഈ ക്രമീകരണങ്ങള്‍ പരീക്ഷിച്ചു നോക്കാവുന്നതാണ്. എല്ലാ സന്ദര്‍ഭങ്ങളിലും എല്ലാ ക്രമീകരണങ്ങളും ആവശ്യം വരില്ല, ഉദാഹരണത്തിന് നിറം പിടിപ്പിച്ച പശ്ചാത്തലം സാധാരണ സന്ദര്‍ഭങ്ങളില്‍ പട്ടികയ്ക്ക് ചേരില്ല. താങ്കള്‍ സൃഷ്ടിക്കുന്ന പട്ടികകള്‍ ലളിതമായിരിക്കാന്‍ ശ്രദ്ധിക്കുക - മറ്റുള്ളവര്‍ക്കും അതില്‍ തിരുത്താന്‍ കഴിയുമെന്നോര്‍ക്കുക. ഈ ഉദാഹരണങ്ങള്‍ എന്തായാലും താങ്കള്‍ക്ക് ഒരു അവബോധം പകര്‍ന്നു തരാന്‍ പ്രാപ്തമാണ്.

വിക്കി വിന്യാസം 

{| border="1" cellpadding="5" cellspacing="0" align="center"
|+'''ഉദാഹരണം'''
|-
! style="background:#efefef;" | ആദ്യ തലക്കെട്ട്
! colspan="2" style="background:#ffdead;" | രണ്ടാം തലക്കെട്ട്
|-
| മുകളില്‍ ഇടത്
| &nbsp;
| rowspan=2 style="border-bottom:3px solid grey;" valign="top" |
വലത് വശം
|-
| style="border-bottom:3px solid grey;" | താഴെ ഇടത്
| style="border-bottom:3px solid grey;" | താഴെ മദ്ധ്യം
|-
| colspan="3" align="center" |
{| border="0"
|+''പട്ടികയ്ക്കുള്ളിലെ പട്ടിക''
|-
| align="center" width="150px" | [[Image:Wiki.png]]
| align="center" width="150px" | [[Image:Wiki.png]]
|-
| align="center" colspan="2" style="border-top:1px solid red; border-right:1px solid red; border-bottom:2px solid red; border-left:1px solid red;" |
വിക്കിമീഡിയയുടെ രണ്ട് ലോഗോകള്‍
|}
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

ഉദാഹരണം
ആദ്യതലക്കെട്ട് രണ്ടാം തലക്കെട്ട്
മുകളില്‍ ഇടത് &nbsp;

വലത് വശം

താഴെ ഇടത് താഴെ മദ്ധ്യം
പട്ടികയ്ക്കുള്ളിലെ പട്ടിക

വിക്കിമീഡിയയുടെ രണ്ട് ലോഗോകള്‍

ഫ്ലോട്ടിങ് പട്ടിക

വിക്കി വിന്യാസം 

ഈ ഖണ്ഡിക പട്ടികയ്ക്ക് മുമ്പ്.  മിടുക്കും ശൌരവുമെല്ലാമൊടുക്കം
നാസ്തിയാം നിന്റെ കടുപ്പം കാട്ടിലെങ്ങാനും കിടക്കും വാനരത്തോടു
കടക്കണ്ണും ചുമത്തിക്കൊണ്ടടുക്കും വിക്രമീ പല്ലും കടിക്കും വല്ലികള്‍ തല്ലി
പൊടിക്കും...

{| align="right" border="1"
| നിര 1, വരി 1 
| rowspan="2"| നിര 2, വരി 1 (ഉം 2ഉം) 
| നിര 3, വരി 1 
|- 
| നിര 1, വരി 2 
| നിര 3, വരി 2 
|}

ഫ്ലോട്ടിങ് പട്ടിക വലത്തായിട്ടാണെന്നോര്‍ക്കുക.   

ഈ ഖണ്ഡിക പട്ടികയ്ക്കു ശേഷം.  മിടുക്കും ശൌരവുമെല്ലാമൊടുക്കം
നാസ്തിയാം നിന്റെ കടുപ്പം കാട്ടിലെങ്ങാനും കിടക്കും വാനരത്തോടു
കടക്കണ്ണും ചുമത്തിക്കൊണ്ടടുക്കും വിക്രമീ പല്ലും കടിക്കും വല്ലികള്‍ തല്ലി
പൊടിക്കും...

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

ഈ ഖണ്ഡിക പട്ടികയ്ക്ക് മുമ്പ്. മിടുക്കും ശൌരവുമെല്ലാമൊടുക്കം നാസ്തിയാം നിന്റെ കടുപ്പം കാട്ടിലെങ്ങാനും കിടക്കും വാനരത്തോടു കടക്കണ്ണും ചുമത്തിക്കൊണ്ടടുക്കും വിക്രമീ പല്ലും കടിക്കും വല്ലികള്‍ തല്ലി പൊടിക്കും......


നിര 1, വരി 1 നിര 2, വരി 1 (ഉം 2ഉം) നിര 3, വരി 1
നിര 1, വരി 2 നിര 3, വരി 2


ഫ്ലോട്ടിങ് പട്ടിക വലത്തായിട്ടാണെന്നോര്‍ക്കുക.

ഈ ഖണ്ഡിക പട്ടികയ്ക്കു ശേഷം. മിടുക്കും ശൌരവുമെല്ലാമൊടുക്കം നാസ്തിയാം നിന്റെ കടുപ്പം കാട്ടിലെങ്ങാനും കിടക്കും വാനരത്തോടു കടക്കണ്ണും ചുമത്തിക്കൊണ്ടടുക്കും വിക്രമീ പല്ലും കടിക്കും വല്ലികള്‍ തല്ലി പൊടിക്കും...

പട്ടികയ്ക്കുള്ളിലെ പട്ടിക

ഒരു പട്ടികയുടെ കളങ്ങള്‍ക്കുള്ളില്‍ അഞ്ച് മറ്റ് പട്ടികകള്‍ (നീലനിറത്തില്‍) ഉള്‍പ്പെടുത്തിയിരിക്കുന്നു. |ക| എന്ന പട്ടികയുടേയും |ച|ച| എന്ന പട്ടികയുടേയും സ്വയം ലംബസ്ഥാനം സ്വീകരിച്ചിരിക്കുന്നു. |ട|, |ത| എന്നീ പട്ടികകള്‍ ഫ്ലോട്ട് ഉപയോഗിച്ച് സ്ഥാന നിര്‍ണ്ണയം ചെയ്തിരിക്കുന്നു. രൂപരേഖകളിലും ചാര്‍ട്ടിലുമൊക്കെ ഈ രീതി കൈക്കൊള്ളാവുന്നതാണ്. പട്ടികയ്ക്കുള്ളിലെ പട്ടിക പുതിയൊരു വരിയില്‍ തുടങ്ങേണ്ടതാണ്.

വിക്കി വിന്യാസം

{| border="1"

 &alpha;
 കളം 2

{| border="2" style="background:#ABCDEF;" <!-- പട്ടികയ്ക്കുള്ളിലെ പട്ടിക പുതിയൊരു വരിയിലായിരിക്കണം -->
| ഉള്ളിലുള്ള
|-
| പട്ടിക
|}

പ്രഥമ പട്ടിക

{| border="2" style="background:#ABCDEF;;"
| ക
|}
{| border="2" style="background:#ABCDEF;"
| ച || ച
|}


{| border="2" style="background:#ABCDEF; float:left;"
| ട
|}
{| border="2" style="background:#ABCDEF; float:right;"
| ത
|}
 |}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

α കളം 2
ഉള്ളിലുള്ള
പട്ടിക
പ്രഥമ പട്ടിക
ക
ച ച
ട
ത

കോളംസ്പാനിന്റേയും റോസ്പാനിന്റേയും ഉപയോഗം

വിക്കി വിന്യാസം 

{| border="1" cellpadding="5" cellspacing="0"
|-
| നിര 1 || നിര 2 || നിര 3
|-
| rowspan="2"| ക
| colspan="2" align="center"| ഖ
|-
| ഗ <!-- നിര 1-ല്‍ കളം ക അധിനിവേശിച്ചിരിക്കുന്നു -->
| ഘ 
|-
| ങ
| rowspan="2" colspan="2" align="center"| ച
|- 
| ഛ <!-- നിര 2+3,  കളം ച അധിനിവേശിച്ചിരിക്കുന്നു -->
|- 
| colspan="3" align="center"| ജ
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

നിര 1 നിര 2 നിര 3
ക ഖ
ഗ <!-- നിര 1-ല്‍ കളം ക അധിനിവേശിച്ചിരിക്കുന്നു --> ഘ
ങ ച
ഛ <!-- നിര 2+3, കളം ച അധിനിവേശിച്ചിരിക്കുന്നു -->
ജ

കളം ഛ' യിലെ rowspan="2" ന്റെ ഒപ്പം കളം ച യ്ക്കായി rowspan="3" ഉപയോഗിച്ചാല്‍ ഛ യ്ക്കും ച യ്ക്കും അടിയില്‍ പുതിയൊരു വരി കിട്ടില്ല. എന്നോര്‍ക്കുക. ശൂന്യമായ കളങ്ങള്‍ കാണിക്കില്ല.

ഒരു നിരയിലെ മുഴുവന്‍ കളങ്ങളും ശൂന്യമാണെങ്കില്‍ നിരയേ കാണിക്കില്ല. ശൂന്യമായതും ശൂന്യമല്ലാത്തതുമായ കളങ്ങള്‍ക്കിടയില്‍ സീമയുണ്ടെങ്കില്‍ അതും കാണിക്കാനിടയില്ല (ബ്രൌസറധിഷ്ഠിതം). ശൂന്യമായ കളങ്ങളില്‍ ശൂന്യമല്ലെന്നു തെറ്റിദ്ധരിപ്പിക്കാന്‍ അതുകൊണ്ട് &nbsp; ഉപയോഗിക്കുക.

പട്ടികകള്‍ മദ്ധ്യഭാഗത്തായി നിലനിര്‍ത്താന്‍

താളിനു നടുക്കായി നില്‍ക്കുന്ന പട്ടികകള്‍ നിര്‍മ്മിക്കാവുന്നതാണ് പക്ഷേ അവ "float" ആയി നല്‍കരുത്, പട്ടികയ്ക്കിരുവശത്തുമായി എഴുത്തുകള്‍ ഉണ്ടാകരുതെന്നര്‍ത്ഥം. അതിനായി {| style="margin: 1em auto 1em auto" ഉപയോഗിക്കുക.

വിക്കി വിന്യാസം 

{| class="wikitable" style="margin: 1em auto 1em auto"
|+ '''ഇടത്തേക്ക് ചേര്‍ന്നെഴുത്തുകളുള്ള കളങ്ങള്‍, പട്ടിക മദ്ധ്യത്തില്‍'''
! നിന്നില്ല || ഒരിത്തിരി || നേരമാരും
|-
| തമ്പകം  || പോരാ || മരുതു പോരാ
|-
| തമ്പുരാന്‍ || കല്‍പ്പിച്ചിരിക്ക || അല്ലേ.
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

ഇടത്തേക്ക് ചേര്‍ന്നെഴുത്തുകളുള്ള കളങ്ങള്‍, പട്ടിക മദ്ധ്യത്തില്‍
നിന്നില്ല ഒരിത്തിരി നേരമാരും
തമ്പകം പോരാ മരുതു പോരാ
തമ്പുരാന്‍ കല്‍പ്പിച്ചിരിക്ക അല്ലേ.

ചരങ്ങളുടെ ഉപയോഗം

കളത്തിനു തുടക്കത്തില്‍ ചരങ്ങള്‍ നല്‍കുക ഒടുവില്‍ ഒരു ലംബവരയും ഇടുക, ഉദാഹരണത്തിന് width="300"| എന്നുപയോഗിക്കുന്നത് കളത്തിന്റെ വീതി 300 ബിന്ദുക്കളാക്കി മാറ്റും. ഒന്നിലധികം ചരങ്ങള്‍ ഉണ്ടെങ്കില്‍ അവയോരോന്നിനുമിടയില്‍ ഓരോ ഇട (Space) നല്‍കുക.

വിക്കി വിന്യാസം 

{| style="color:white"
|-
| bgcolor="red"|കളം 1 || width="300" bgcolor="blue"|കളം 2 || bgcolor="green"|കളം 3
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

കളം 1 കളം 2 കളം 3

ദശാംശത്തിനനുസരിച്ച് സംഖ്യകള്‍ കാണിക്കാന്‍

ദശാംശ ചിഹ്നത്തിനെ അനുസരിച്ച് സംഖ്യകളെ നിരത്തി കാണിക്കാന്‍ ഉപയോഗിക്കാവുന്ന ഒരു മാര്‍ഗ്ഗം:

വിക്കി വിന്യാസം 

{| cellpadding="0" cellspacing="0"
|align="right"| 432 || .1
|-
|align="right"| 43 || .21
|-
|align="right"| 4 || .321
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

432 .1
43 .21
4 .321

സെല്‍പാഡിങോ, സെല്‍‌സ്പേസിങോ (cellpadding, cellspacing) ഉണ്ടെങ്കില്‍ രണ്ട് കളങ്ങളിലായി എഴുതുന്ന സംഖ്യയെ നടുക്കുകൂടി ഉണ്ടായേക്കാവുന്ന വിടവിനെ മറച്ച് ഒരുമിച്ചു കാട്ടാന്‍ കഴിയും. അതിനായി പട്ടികയ്ക്കുള്ളിലൊരു പട്ടിക നിര്‍മ്മിച്ച് അതിന്റെ നിരയുടെ വീതി ആവശ്യാനുസരണം വ്യക്തമാക്കികൊടുക്കുക. ഉള്ളില്‍ നിര്‍മ്മിക്കുന്ന പട്ടികയുടെ നിരയുടെ വീതി നിരയിലെ കളങ്ങളുടെ വീതി തന്നെയായിരിക്കണം. (ദശാംശസംഖ്യകള്‍ എന്നിട്ടും ശരിയായി പ്രത്യക്ഷപ്പെടുന്നില്ലങ്കില്‍ പ്രധാന പട്ടികയുടെ നിര വളരെ ഇടുങ്ങിയതായിരിക്കണം. നിരയുടെ വീതി കൂട്ടാനുള്ള ചരങ്ങള്‍ ഉപയോഗിക്കുക.)

വിക്കി വിന്യാസം 

{|border="1" cellpadding="4" cellspacing="2"
|
{|cellpadding="0" cellspacing="0" width="100%"
|align="right" width="50%"| 432 ||width="50%"| .1
|}
|-
|
{|cellpadding="0" cellspacing="0" width="100%"
|align="right" width="50%"| 43 ||width="50%"| .21
|}
|-
|
{|cellpadding="0" cellspacing="0" width="100%"
|align="right" width="50%"| 4 ||width="50%"| .321
|}
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

432 .1
43 .21
4 .321

ലളിതമായി ഉപയോഗിക്കാവുന്ന സന്ദര്‍ഭങ്ങളില്‍ ആദ്യവരിയില്‍ ഒരു ഇട നല്‍കി അടുത്ത വരികളില്‍ ആവശ്യാനുസരണം ഇടകള്‍ നല്‍കി സംഖ്യകളുടെ സ്ഥാനം സ്ഥാപിക്കാവുന്നതേയുള്ളു: 

432.1
 43.21
  4.321

സ്റ്റൈല്‍ ക്ലാസ്സുകള്‍

ഇംഗ്ലീഷ് വിക്കിപീഡിയയിലെ സ്റ്റൈലിനെ പറ്റിയുള്ള താള്‍ കാണുക.

പട്ടികയുടെ മൂലഭാഷയുടെ ആദ്യവരിയില്‍ "{|" വേണ്ട സ്റ്റൈല്‍ മുഴുവന്‍ എഴുതിക്കൊടുക്കുന്നതിനു പകരം ഒരു കാസ്കേഡിങ് സ്റ്റൈല്‍ ഷീറ്റ് (w:Cascading Style Sheets, സി.എസ്.എസ്.) ക്ലാസ് നല്‍കാവുന്നതാണ്. ആ ക്ലാസിനുള്ള സ്റ്റൈലുകള്‍ പലവിധത്തില്‍ നിര്‍വചിക്കാം

  • സോഫ്റ്റ്വെയറിനുള്ളില്‍ തന്നെ, രൂപത്തിന് (skin) അനുസരിച്ച് (ഉദാ: class sortable)
  • ഒരു വിക്കിയിലെ എല്ലാ ഉപയോക്താക്കള്‍ക്കും വേണ്ടി മീഡിയവിക്കി:Common.css ഉപയോഗിച്ച്.
  • collectively for all users of one wiki in MediaWiki:Common.css (ഉദാ: ഈ വിക്കിയിലും മറ്റു പല പദ്ധതികളിലുമുള്ള class wikitable).
  • ഒരു രൂപത്തിനു പ്രത്യേകമായി മീഡിയവിക്കി:Monobook.css മുതലായവ ഉപയോഗിച്ച്.
  • ഉപയോക്താവിന്റെ ഉപതാളില്‍ കുറിച്ചുകൊടുക്കുന്നതനുസരിച്ച് ഓരോരുത്തരുടെ താത്പര്യപ്രകാരം.
  • ഉപയോക്താവിന്റെ സ്വന്തം കമ്പ്യൂട്ടറില്‍ നിര്‍വചിച്ചിരിക്കുന്ന പ്രകാരം എല്ലാ വെബ് താളുകള്‍ക്കുമായി.

പട്ടികയെ രൂപപ്പെടുത്താനാവശ്യമായ എല്ലാ ചരങ്ങളും ഓര്‍ത്തിരിക്കുന്നതിലും എത്രയോ എളുപ്പമാണ് അനുയോജ്യമായ സ്റ്റൈല്‍ ക്ലാസ് {| നു ശേഷം ചേര്‍ക്കുന്നത്. ഇത് പട്ടികയെ സുദൃഢം ആക്കുന്നു, കൂടാതെ ഒരു മാറ്റം കൊണ്ടുതന്നെ ക്ലാസ് ഉപയോഗിക്കുന്ന എല്ലാ പട്ടികകളേയും മെച്ചപ്പെടുത്തുവാനും സഹായിക്കുന്നു. : 

{| border="1" cellpadding="2"
|+ഗുണനപ്പട്ടിക
|-
! &times; !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}
 
ഗുണനപ്പട്ടിക
× 1 2 3
1 1 2 3
2 2 4 6
3 3 6 9
4 4 8 12
5 5 10 15
ഇങ്ങിനെ ആയി തീരും:
{| class="wikitable"
|+ഗുണനപ്പട്ടിക
|-
! &times; !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}
 
ഗുണനപ്പട്ടിക
× 1 2 3
1 1 2 3
2 2 4 6
3 3 6 9
4 4 8 12
5 5 10 15

ഇവിടെ പട്ടികയ്ക്കൊപ്പം കൊടുക്കേണ്ടിയിരുന്ന ചരങ്ങളെ class="wikitable" കൊണ്ട് പ്രതിനിധീകരിച്ചിരിക്കുന്നു. മീഡിയവിക്കി:Common.css-ല്‍ table.wikitable എന്നതിനായി ഒരുകൂട്ടം സ്റ്റൈല്‍ നിയമങ്ങള്‍ wikitable ക്ലാസ് ആയി ഉള്ളതുകൊണ്ടാണ്. താങ്കള്‍ പട്ടികയെ ക്ലാസ് ഉപയോഗിച്ച് അടയാളപ്പെടുത്തുമ്പോള്‍ അതിലെ നിയമങ്ങളെല്ലാം പട്ടികയില്‍ പ്രവര്‍ത്തിക്കുന്നു. താങ്കള്‍ക്ക് വേണമെങ്കില്‍ കൂടുതല്‍ സ്റ്റൈല്‍ നിയമങ്ങള്‍ അതോടൊപ്പം പട്ടികയോടൊപ്പം ചേര്‍ക്കാവുന്നതാണ്. അത്തരം നിയമങ്ങള്‍ ക്ലാസിലെ നിയമങ്ങള്‍ അതിലംഘിച്ച് പ്രവര്‍ത്തിക്കുന്നതായിരിക്കും. അതുകൊണ്ട് ക്ലാസ് സ്റ്റൈലിനെ അടിസ്ഥാനമാക്കി താങ്കള്‍ക്ക് സ്റ്റൈല്‍ കൂടുതല്‍ വികസിപ്പിക്കാവുന്നതാണ്:


വിക്കി വിന്യാസം 

{| class="wikitable" style="font-style:italic; font-size:120%; border:3px dashed red;"
|+ഗുണനപ്പട്ടിക
|-
! &times; !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

ഗുണനപ്പട്ടിക
× 1 2 3
1 1 2 3
2 2 4 6
3 3 6 9
4 4 8 12
5 5 10 15

ഇവിടെ പട്ടികയുടെ പശ്ചാത്തലം wikitable ക്ലാസ്സില്‍ നിര്‍വചിച്ചിരിക്കുന്ന ചാര നിറവും, തലക്കുറികള്‍ കട്ടികൂട്ടി എഴുതിയതും മദ്ധ്യഭാഗത്തായി സ്ഥാപിച്ചിരിക്കുന്നതും ആണെങ്കിലും, എഴുത്തുകള്‍ പട്ടികയില്‍ എഴുതി നല്‍കിയിരിക്കുന്ന സ്റ്റൈല്‍ നിയമങ്ങള്‍ ഉപയോഗിച്ച് അതിലംഘിച്ചിരിക്കുന്നു. എഴുത്തുകള്‍ 120% വലിപ്പക്കൂടുതലുള്‍ലതാണ്, സീമയടയാളങ്ങള്‍ക്കാവട്ടെ ചുവന്ന വരകള്‍ ഉപയോഗിച്ചിരിക്കുന്നു.

ഇന്‍‌ലൈന്‍ സി.എസ്.എസ്. പിന്തുണയുള്ള ബ്രൌസറുകളില്‍ മാത്രമേ ഇതു ലഭിക്കുള്ളു എന്നോര്‍ക്കുക. അത് പ്രധാനമെങ്കില്‍ "font-size:120%" എന്നതിനു പകരം നിന്നേക്കാവുന്ന എക്സ്.എച്ച്.റ്റി.എം.എല്‍ വിന്യാസമായ <big> എന്നോ "font-style:italic" എന്നതിനു പകരമായ വിക്കിവിന്യാസം ''ചെരിച്ചെഴുത്ത്'' എന്നോ ഉപയോഗിക്കുക.

ക്രമപ്പെടുത്തല്‍ (സോര്‍ട്ടിങ്)

class="sortable" എന്ന ക്ലാസ് ഉപയോഗിച്ച് പട്ടികകളെ ക്രമപ്പെടുത്താന്‍ സാധിക്കും, കൂടുതല്‍ വിവരങ്ങള്‍ക്ക് സഹായം:ക്രമപ്പെടുത്തല്‍(en:Help:Sorting) കാണുക. ഇത് വളരെ ഉപകാരപ്രദമായ ഒരു ധര്‍മ്മം കൈകാര്യം ചെയ്യുന്നതുകൊണ്ട് ഉപയോഗിക്കുമ്പോള്‍ ഗുണങ്ങളും ദോഷങ്ങളും ശ്രദ്ധിക്കുവാന്‍ ശ്രമിക്കുക. ഉദാഹരണത്തിന്:

  • പല വരികളില്‍ കിടക്കുന്ന ഉപതലക്കെട്ടുകളുള്ള രീതിയില്‍ പട്ടികയെ വിഭജിക്കരുത്. പകരം ഒരു നിര കൂടി കൂട്ടിച്ചേര്‍ത്ത് ഓരോ വരിയിലേയും തലക്കെട്ടുകള്‍ ചുരുക്കി ഉള്‍പ്പെടുത്താവുന്ന വിധത്തില്‍ നിരയുണ്ടാക്കാവുന്നതാണ്.
  • ഉള്ളടക്കം പല നിരകളില്‍ കിടക്കുന്ന വിധത്തില്‍ പട്ടിക സൃഷ്ടിക്കരുത്, വീണ്ടും പകരമായി കളങ്ങളില്‍ വിവരങ്ങല്‍ ചുരുക്കി നല്‍കാവുന്നതാണ്
  • സംഖ്യകളുടെ ഒരു നിരയില്‍ അക്ഷരങ്ങള്‍ ഇടകലര്‍ത്തി ഉപയോഗിക്കരുത്. അത് ശരിയായ ഫലം നല്‍കണമെന്നില്ല.

പട്ടികയില്‍ ചുരുക്കരൂപങ്ങള്‍ ഉപയോഗിക്കുന്നുണ്ടെങ്കില്‍ അത് പട്ടികയ്ക്ക് പുറത്ത് വിപുലമാക്കി നല്‍കുക.

വിക്കി വിന്യാസം 

{| class="wikitable sortable"
|+ക്രമപ്പെടുത്താവുന്ന പട്ടിക
|-
! അക്ഷരം !! സംഖ്യ !! ദിനം !! class="unsortable" | ക്രമപ്പെടുത്തത്തില്ലാത്തത്
|-
| ക || 2 || 2008-11-24 || ഈ
|-
| പ || 8 || 2004-03-01 || നിരയില്‍
|-
| ട || 6 || 1979-07-23 || ക്രമപ്പെടുത്തല്‍
|-
| ച || 4 || 1492-12-08 || അസാദ്ധ്യം
|-
| ത || 0 || 1601-08-13 || ആണ്.
|}

ബ്രൌസറില്‍ ദൃശ്യമാവുന്ന വിധം

ക്രമപ്പെടുത്താവുന്ന പട്ടിക
അക്ഷരം സംഖ്യ ദിനം ക്രമപ്പെടുത്തത്തില്ലാത്തത്
ക 2 2008-11-24 ഈ
പ 8 2004-03-01 നിരയില്‍
ട 6 1979-07-23 ക്രമപ്പെടുത്തല്‍
ച 4 1492-12-08 അസാദ്ധ്യം
ത 0 1601-08-13 ആണ്.


വരിക്കുള്ള ഫലകം

എച്ച്.റ്റി.എം.എല്ലോ, വിക്കിവിന്യാസമോ ഉപയോഗിച്ചുണ്ടാക്കുന്ന പട്ടികകളില്‍ ചിലകാര്യങ്ങള്‍ പൊതുവായിട്ടുള്ളതായിരിക്കും ഉദാ:

  • പട്ടികയുടെ വരിയുടെ അടിസ്ഥാന കോഡ്
  • നിറത്തിനോ, സ്ഥാനത്തിനോ, ക്രമപ്പെടുത്തലിനോ ഉള്ള കോഡ്
  • ഏകകങ്ങള്‍ പോലെ മാറ്റമില്ലാത്ത കാര്യങ്ങള്‍
  • പ്രത്യേകതരത്തിലുള്ള ക്രമപ്പെടുത്തലിനുള്ള മാര്‍ഗ്ഗരേഖകള്‍

ഇത്തരം സന്ദര്‍ഭങ്ങളില്‍ വിവരങ്ങള്‍ ചരങ്ങളായി നല്‍കുന്ന ഒരു ഫലകം ഉപയോഗിക്കുകയാണെങ്കില്‍ അതേറെ ഉപകാരപ്രദമായിരിക്കും. എന്തുകൊണ്ടെന്നാല്‍:

  • നിരകളുടെ ക്രമം മാറ്റാനോ നിര തന്നെ നീക്കം ചെയ്യാനോ എളുപ്പമായിരിക്കും.
  • ഒരു നിരയിലെ പല കളങ്ങളും ശൂന്യമെങ്കില്‍ ഒരു പുതിയ നിര കൂട്ടിച്ചേര്‍ക്കാന്‍ എളുപ്പമായിരിക്കും.
  • മറ്റു സ്ഥലങ്ങളില്‍ നിന്ന് എടുക്കുന്ന വിവരങ്ങളില്‍ ഗണിതക്രിയ ആവശ്യമുണ്ടെങ്കില്‍, ഉദാ: ജനസംഖ്യ, വിസ്തീര്‍ണ്ണം എന്നിവ ഉപയോഗിച്ച് ജനസാന്ദ്രത കണ്ടുപിടിക്കല്‍
  • ക്രമപ്പെടുത്തി കാണിക്കാനും അല്ലാതെ കാണിക്കാനുമായി വിവരങ്ങളുടെ പകര്‍പ്പ് ആവശ്യമെങ്കില്‍
  • ഒരു നിരയുടെ മുഴുവന്‍ നിറവും ദൃശ്യസ്ഥാനവുമൊക്കെ നിര്‍വചിക്കാന്‍
{| class="wikitable sortable"
|-
! a
! b
! a/b
|}

ലഭിക്കുന്നത്:

a b a/b

സഹായം:Table/example row template സഹായം:Table/example row template സഹായം:Table/example row template

പട്ടികയില്‍ വ്യവസ്ഥാധിഷ്ഠിതമായ വരി

പട്ടികയില്‍ വ്യവസ്ഥാധിഷ്ഠിതമായ വരി വേണമെങ്കില്‍: 

{| class=wikitable
  {{ #if:1|{{!}}-                     <!-- row one will be shown because the '1' evaulates to TRUE -->
             !  വരി one, നിര one 
           {{!}}വരി one, നിര two}} <!-- {{!}}'s get evaluated to the pipe character '|', i.e. template:! just contains '|' -->
  {{ #if: |{{!}}-                     <!-- വരി two NOT shown because the space between the ':' and the '|' evaluates to FALSE  -->
             !  വരി two, നിര one 
           {{!}}വരി two, നിര two}}
  |-                                  <!-- വരി three will be shown -->
             ! വരി three, നിര one
             | വരി three, നിര two
|}

താഴെ കാണുന്ന രൂപം നല്‍കുന്നു: (രണ്ടാം വരി കാണില്ലന്നതു ശ്രദ്ധിക്കുക)

വരി one, നിര one വരി one, നിര two
വരി three, നിര one വരി three, നിര two

പട്ടികയ്ക്കായുള്ള മറ്റു കോഡുകള്‍

മീഡിയവിക്കി പിന്തുണയ്ക്കുന്ന മറ്റു കോഡുകള്‍ ഇവയാണ്:

  1. എക്സ്.എച്ച്.റ്റി.എം.എല്‍ (XHTML)
  2. HTML & wiki-<td> ലേഖനവ്യവസ്ഥ (ഉപയോഗിക്കരുത്)

ഇവമൂന്നും ഇപ്പോള്‍ മീഡിയവിക്കി പിന്തുണക്കുന്നുണ്ട്. എങ്കിലും ലംബവരകള്‍ ഉപയോഗിച്ചുള്ള എഴുത്താണ് എളുപ്പം HTML & wiki-<td> (അതായത്, ക്ലോസ് ചെയ്യാത്ത <td> , <tr> റ്റാഗുകള്‍ ഉപയോഗിക്കുന്നത്) ഭാവിയില്‍ ഉപകരണങ്ങളില്‍ അത്ര പ്രചാരത്തില്‍ ഉണ്ടായിരിക്കില്ല എന്നുമോര്‍ക്കുക.

ഇവയും കാണുക: Table (HTML), HTML element#Tables. thead, tbody, tfoot, colgroup, and col തുടങ്ങിയവ മീഡിയവിക്കിയിലില്ലെന്നും ഓര്‍ക്കുക.

പട്ടിക ലേഖനവ്യവസ്ഥകള്‍ തമ്മിലുള്ള താരതമ്യം

 XHTML HTML & Wiki-td Wiki-pipe
Table <table></table> <table></table> 
{|
|}
തലക്കുറി <caption>തലക്കുറി</caption> <caption>തലക്കുറി</caption> 
|+ തലക്കുറി
വരി <tr></tr> <tr> 
|-
കളത്തിലെ വിവരം

<td>കളം1</td>
<td>കളം2</td>

<td>കളം1
<td>കളം2 

| കളം1
| കളം2
കളത്തിലെ വിവരം <td>കളം1</td> <td>കളം2</td> <td>കളം3</td> <td>കളം1 <td>കളം2 <td>കളം3 
| കളം1 || കളം2 || കളം3
കളത്തിന്റെ തലക്കെട്ട് <th>തലക്കെട്ട്</th> <th>തലക്കെട്ട് 
! തലക്കെട്ട്
ഉദാഹരണ പട്ടിക
1 2
3 4 
<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td> 
      <td>4</td> 
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
</table>

{| 
| 1 || 2
|- 
| 3 || 4
|}
ഉദാഹരണ പട്ടിക
1 2
3 4
5 6 
<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td>
      <td>4</td>
   </tr>
   <tr>
      <td>5</td>
      <td>6</td>
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
   <tr>
      <td> 5 <td> 6
</table>

{| 
| 1 || 2 
|- 
| 3 || 4 
|- 
| 5 || 6 
|}
ഗുണം
  • ഏതൊരു എക്സ്.എച്ച്.റ്റി.എം.എല്‍ എഡിറ്റര്‍ ഉപയോഗിച്ചും പരിശോധിക്കുകയും പുതുക്കുകയും ചെയ്യാം
  • എളുപ്പം മാറ്റി എഴുതാം
  • ഏറെ പ്രസിദ്ധം
  • കോഡിങില്‍ വരികളില്‍ ശ്രദ്ധിക്കുന്നില്ല
  • "|" മുതലായവ ഇല്ലാത്തതിനാല്‍ ഫലകങ്ങളുമായും മറ്റും പ്രശ്നമുണ്ടാകില്ല
  • ഏതൊരു എക്സ്.എച്ച്.റ്റി.എം.എല്‍ എഡിറ്റര്‍ ഉപയോഗിച്ചും പരിശോധിക്കുകയും പുതുക്കുകയും ചെയ്യാം
  • എളുപ്പം മാറ്റി എഴുതാം
  • ഏറെ പ്രസിദ്ധം
  • എക്സ്.എച്ച്.റ്റി.എം.എല്ലിനെ അപേക്ഷിച്ചു കുറച്ചു സ്ഥലം മതി
  • കോഡിങില്‍ വരികളില്‍ ശ്രദ്ധിക്കുന്നില്ല
  • "|" മുതലായവ ഇല്ലാത്തതിനാല്‍ ഫലകങ്ങളുമായും മറ്റും പ്രശ്നമുണ്ടാകില്ല
  • എഴുതാന്‍ എളുപ്പം
  • വായിക്കാന്‍ എളുപ്പം
  • സ്ഥലം കുറച്ചു മതി
ദോഷങ്ങള്‍
  • മനസ്സുമടുപ്പിക്കും
  • വളരെ സ്ഥലമെടുക്കും
  • കോഡ് വായിച്ചു മനസ്സിലാക്കാന്‍ ബുദ്ധിമുട്ടാണ്
  • ഭാവിയില്‍ പിന്തുണ ലഭിക്കാനിടയില്ല
  • പരിചിതമല്ലാത്ത രീതി
  • ഘടനയിലെ ലാളിത്യമില്ലായ്മ
  • കോഡ് വശത്തുനിന്നും ക്രമപ്പെടുത്തി എഴുതാന്‍ കഴിയില്ല
  • ആശ്ചര്യചിഹ്നവും, അധികചിഹ്നവും, ലംബവരയും എല്ലാമുള്ള ഇതു വായിക്കുന്നതിലും ചിലര്‍ക്ക് എളുപ്പം എച്ച്.റ്റി.എം.എല്‍ വായിക്കുന്നതാണ്
  • എച്ച്.റ്റി.എം.എല്‍. റ്റാഗുകളിലേക്കുള്ള ഒരു കുറുക്കുവഴിമാത്രമാണിത്, എച്ച്.റ്റി.എം.എല്‍ അറിയില്ലാത്തവര്‍ക്ക് എളുപ്പമായി തോന്നാനിടയില്ല
  • പട്ടികയില്‍ ഉള്‍പ്പെട്ട ഒരു ഫലകത്തില്‍ ചരങ്ങള്‍ ഉണ്ടെങ്കില്‍ "|"-നു വേണ്ടി Template:! ഉപയോഗിക്കണം.
  • പുതിയവരികളുടെ കാര്യത്തില്‍ നിര്‍ബന്ധമുണ്ട്. അതുകൊണ്ട് ഫലകങ്ങളും ചരങ്ങളും ഒക്കെ ഉണ്ടെങ്കില്‍ ചിലപ്പോള്‍ പ്രത്യേക മാര്‍ഗ്ഗങ്ങള്‍ കൈക്കൊള്ളേണ്ടി വന്നേക്കാം (w:Help:Newlines and spaces)
 XHTML HTML & Wiki-td Wiki-pipe

കാണുക w:Template talk:For#Tables.

ലംബവര ലേഖന വ്യവസ്ഥ സൃഷ്ടിക്കപ്പെടുന്ന എച്ച്.റ്റി.എം.എല്ലില്‍

മാഗ്നസ് മാന്‍സ്കേ എന്ന ഉപയോക്താവാണ് ലംബവര ലേഖനവ്യവസ്ഥ, എച്ച്.റ്റി.എം.എല്ലിനു പകരം ലംബവര (|) ഉപയോഗിക്കാനുള്ള മാര്‍ഗ്ഗം വികസിപ്പിച്ചത്. എച്ച്.റ്റി.എം.എല്‍ പട്ടികയെ ലംബവര പട്ടിക ആക്കാനുള്ള ഒരു സ്ക്രിപ്റ്റ് [ഇവിടെ ലഭ്യമാണ്

രണ്ട് കളങ്ങളെ വേര്‍തിരിക്കാനുള്ള ഇരട്ട ലംബവരകള്‍ (||) ഒഴിച്ചുള്ള ലംബവരകള്‍ പുതിയൊരു വരിയിലായിരിക്കണം തുടങ്ങേണ്ടത്. ചരങ്ങള്‍ ആവശ്യമെങ്കില്‍ ചേര്‍ക്കാവുന്നതാണ്.

പട്ടികകള്‍

ഒരു പട്ടികയുടെ നിര്‍വചിച്ചിരിക്കുന്നതിപ്രകാരമാണ് {| ''ചരങ്ങള്‍'' |} അതിന്റെഫലം: <table ''ചരങ്ങള്‍''> ഉള്ളടക്കം </table>

വരികള്‍

<tr> റ്റാഗുകള്‍ ആദ്യവരിയില്‍ സ്വതവേ നിര്‍മ്മിക്കപ്പെടും. പട്ടികയില്‍ പുതിയൊരു വരിക്കായി

കളം1 കളം2 കളം3

എന്നുപയോഗിക്കുക, അല്ലങ്കില്‍

കളം1 കളം2 കളം3

രണ്ടും തുല്യമാണ് 

<td>കളം1</td><td>കളം2</td><td>കളം3</td>

അതുകൊണ്ട് "||" , "പുതിയവരിയില്‍" + "|" എന്നിവ തുല്യമാണ്

കളങ്ങളില്‍ ചരങ്ങള്‍ക്കായി:

കളം1 കളം2 കളം3

അതിന്റെ ഫലം 

<td ചരങ്ങള്‍>കളം1</td>
<td ചരങ്ങള്‍>കളം2</td>
<td ചരങ്ങള്‍>കളം3</td>

തലക്കെട്ടുകള്‍

TD ഉണ്ടായ അതേ പ്രവര്‍ത്തനം തന്നെയാണ് തലക്കെട്ടുകള്‍ക്കും, തുറക്കാനായി "|" എന്നതിനു പകരം "!" എന്നുപയോഗിക്കുക. "||" എന്നരീതിയില്‍ വേണമെങ്കില്‍ "!!" എന്നുപയോഗിക്കുക. ചരങ്ങള്‍ ഇവിടേയും ഒറ്റലംബവരയ്ക്കു "|" ശേഷം നല്‍കുക 

!ചരങ്ങള്‍|കളം1

പട്ടികയുടെ തലക്കെട്ട്

<പട്ടികതലക്കെട്ട്> റ്റാഗ് സൃഷ്ടിക്കാന്‍ ഇപ്രകാരം നല്‍കാം

പട്ടികതലക്കെട്ട് സൃഷ്ടിക്കുന്ന ഫലം <caption>പട്ടികതലക്കെട്ട്</caption> ചരങ്ങള്‍ ഉണ്ടെങ്കില്‍: പട്ടികതലക്കെട്ട് സൃഷ്ടിക്കുന്ന ഫലം <caption ചരങ്ങള്‍>പട്ടികതലക്കെട്ട്</caption>

ഒരു പട്ടികയുടെ കോഡിന്റെ നിര്‍മ്മാണം

ഒരു പട്ടികയുടെ ലളിതമായ വിക്കി വിന്യാസം ഒരു പെട്ടിയുടെ ഉള്ളില്‍ കാണാന്‍. 

{| border="5" cellspacing="5" cellpadding="2"
| style="text-align: center;" | [[Image:gnome-system.png]]
|-
! കമ്പ്യൂട്ടര്‍
|-
| പ്രോസസര്‍ വേഗത: 1.8 GHz
|}

മുകളിലെ കോഡിങില്‍ താഴെ കാണുന്ന പട്ടികയുടെ വിന്യാസമാണുള്ളത്:

പ്രമാണം:Gnome-system.png
കമ്പ്യൂട്ടര്‍
പ്രോസസര്‍ വേഗത: 1.8 GHz

താഴെ കാണുന്ന വിക്കിവിന്യാസം നീലനിറത്തില്‍ സീമയുള്ള ചതുരപ്പെട്ടിയ്ക്കുള്ളില്‍ കോഡ് കാട്ടിത്തരും

  
<pre>
{| border="5" cellspacing="5" cellpadding="2"
| style="text-align: center;" | [[Image:gnome-system.png]]
|-
! കമ്പ്യൂട്ടര്‍
|-
| പ്രോസസര്‍ വേഗത: 1.8 GHz
|}
</pre>
 

നീലനിറത്തിലുള്ള സീമയുള്ള ചതുരപ്പെട്ടി നിര്‍മ്മിക്കാന്‍ <pre> എന്ന എച്ച്.റ്റി.എം.എല്‍. റ്റാഗ് ഉപയോഗിച്ചിരിക്കുന്നതു ശ്രദ്ധിക്കുക.

പട്ടികയുടെ വിക്കിവിന്യാസം പ്രദര്‍ശിപ്പിക്കാനുള്ള മറ്റുവഴികള്‍

പലപ്പോഴും വെബ് ബ്രൌസറിനുള്ളില്‍ പ്രദര്‍ശിപ്പിക്കുന്ന പട്ടികയുടെ വിക്കിവിന്യാസത്തിന്റെ വരികളുടെ നീളം വലിയതാവുകയും താഴെയായി സ്ക്രോളിങ് ബാര്‍ പ്രത്യക്ഷപ്പെടുകയും, വരി മുഴുവന്‍ വായിക്കണമെങ്കില്‍ (ഇടത്തു വശത്തുള്ള സ്ക്രോള്‍ ബാറിനൊപ്പം) താഴെയുള്ള സ്കോള്‍ ബാര്‍ വലിക്കേണ്ടി വരികയും ചെയ്യും. കാരണം <pre> റ്റാഗിന്റെ ഉപയോഗം വരികളെ യാതൊരു മാറ്റവുമില്ലാതെ കാണിക്കുന്നു. വരികള്‍ അടുത്ത വരിയിലേക്ക് മുറിച്ചു മുറിച്ചു ചേര്‍ത്തോ <p>, <tt>, <br /> എന്ന റ്റാഗുകള്‍ <pre> റ്റാഗിനു പകരം ചേര്‍ത്തോ പ്രശ്നം പരിഹരിക്കാവുന്നതാണ്. <tt>...</tt> തുടങ്ങിയ റ്റാഗുകള്‍ക്കുള്ളില്‍ വിക്കിവിന്യാസം ചേര്‍ക്കുന്നത് ഫിക്സഡ് വിഡ്ത്തില്‍ കാണാനും അതുകൊണ്ട് എളുപ്പം വായിക്കാനും സഹായിക്കും. <br /> റ്റാഗ് ഉപയോഗിക്കുന്നത് പുതിയ വരിയിലേക്ക് എഴുത്തു വാ‍ാനും കാരണമാകും. <p> റ്റാഗ് സി.എസ്.എസ്. സ്റ്റൈലുകളോടൊപ്പം ചേര്‍ക്കുന്നത് നീല സീമയുള്ള പെട്ടി ലഭിക്കാന്‍ സഹായിക്കും


ഒരു ഉദാഹരണം താഴെ:

{| border="5" cellspacing="5" cellpadding="2"
| style="text-align: center;" | [[Image:gnome-system.png]]
|-
! കമ്പ്യൂട്ടര്‍
|-
| style="color: yellow; background-color: green;" | പ്രോസസര്‍ വേഗത: <span style="color: white;"> 1.8 GHz </span>
|}

താഴെ കാണുന്ന പട്ടിക സൃഷ്ടിക്കും:

പ്രമാണം:Gnome-system.png
കമ്പ്യൂട്ടര്‍
പ്രോസസര്‍ വേഗത: 1.8 GHz

വിന്യാസങ്ങള്‍ കാണിക്കുന്ന മുകളിലെ പെട്ടിയില്‍ വരികള്‍ മുറിച്ചുകാണിക്കാനുള്ള ശൈലി ചേര്‍ത്തിരിക്കുന്നു. വിന്യാസത്തിലെ വലിയ വരി (മുകളില്‍ നിന്നും ആറാമത്തേത്) “വിന്യാസപ്പെട്ടിയില്‍” മുറിച്ചു കാണിച്ചിരിക്കുന്നതു കാണുക. ഈ വിന്യാസപ്പെട്ടിയും വിന്യാസവും തിരുത്തലിടത്തില്‍ താഴെ കൊടുത്തിരിക്കുന്നതു പ്രകാരമായിരിക്കും.

<p style="padding: 1em; border: 1px dashed #2f6fab; color: Black; background-color: #f9f9f9; line-height: 1.1em;"> <tt>
<nowiki>{|</nowiki> border="5" cellspacing="5" cellpadding="2" <br />

<nowiki>[[</nowiki>Image:gnome-system.png]] <br />
കമ്പ്യൂട്ടര്‍ <br />
സംഖ്യാവിന്യാസമുപയോഗിച്ച് എഴുതുമ്പോള്‍ “വിന്യാസപ്പെട്ടി” മറ്റൊരു വിധത്തില്‍ ദൃശ്യമാകുന്നു, വലിയ വരികള്‍ വെബ് ബ്രൌസറിന്റെ വീതിക്കനുസരിച്ച് സ്വയം മുറിച്ച് കാണിക്കുന്നതു ശ്രദ്ധിക്കുക   
പ്രമാണം:Gnome-system.png
കമ്പ്യൂട്ടര്‍
പ്രോസസര്‍ വേഗത: 1.8 GHz

<p style="padding: 1em; border: 1px dashed #2f6fab; color: Black; background-color: #f9f9f9; line-height: 1.1em;"> <tt>
&#123;&#124; border="5" cellspacing="5" cellpadding="2" <br />
&#124; style="text-align: center;" &#124; &#91;&#91;Image:gnome-system.png]] <br />
&#124;- <br />
&#33; കമ്പ്യൂട്ടര്‍ <br />
&#124;- <br />
&#124; style="color: yellow; background-color: green;" &#124; പ്രോസസര്‍ വേഗത: &#60;span style="color: red;"> 1.8 GHz &#60;/span> <br />
&#124;&#125; <br />
</tt> </p>

ഇതും കാണുക വിക്കിവിന്യാസം പ്രവര്‍ത്തിക്കാതെ കാണാന്‍.

ചതുര മോണിറ്ററുകള്‍

വീതിയേറിയ കമ്പ്യൂട്ടര്‍ മോണിറ്ററുകളില്‍ കാണാനായി സൃഷ്ടിച്ച ഗാലറികളോ ചിത്രങ്ങളോ ചതുരത്തിലുള്ള മോണിറ്ററുകളിലെ ദൃശ്യത്തെ വികലമാക്കും, ഓരോ വരിയും താളിന്റെ കാണാവുന്ന ഭാഗത്തിന്റെ പുറത്തേക്ക് വ്യാപിച്ചു കിടക്കാനിടയുണ്ട്. താഴെ കൊടുത്തിരിക്കുന്ന കോഡ് അത്തരമൊരു സാധ്യതയെ ഒഴിവാക്കുന്നു

ഇപ്രകാരം ഉപയോഗിക്കുക:

<center>
{| border="0" style="background:transparent;"
|-
|
[[Image:Some_window_blinds.JPG|192px x 155px|thumb|left|വിവിധ വിന്‍ഡോ ഷേഡുകള്‍]]
||
[[Image:Vert-blinds-2145-rs.jpg|192px x 170px|thumb|left|വിലങ്ങനെയുള്ള മറവുകള്‍]]
||
[[Image:Gardine.jpg|192px x 155px|thumb|left|ഇതൊരു മറവല്ല]]
|}
</center>
<br />
<center>
{| border="0" style="background:transparent;"
|-
|
[[Image:Vorhang.jpg|192px x 155px|thumb|left|കട്ടിയുള്ള ഷേഡ്]]
||
[[Image:Jalousie-1.jpg|328px x 55px|thumb|left|കുറുകെയുള്ള മറവുകള്‍]]
|}
</center>
<br />
<center>
{| border="0" style="background:transparent;"
|-
|
[[Image:Some_window_blinds.JPG|225px|thumb|left|ഷേഡ്, ഷട്ടര്‍, വിലങ്ങനെയും കുറുകനെയുമുള്ള മറവുകള്‍.]]
||
[[Image:Miniblinds detail of mechanism.jpg|418px|thumb|left|മറവ് ചെറുമറവുകളുമായി ചേര്‍ന്നു നില്‍ക്കുമ്പോള്‍]]
|}
</center>


For this:

പ്രമാണം:Some window blinds.JPG
വിവിധ വിന്‍ഡോ ഷേഡുകള്‍
പ്രമാണം:Vert-blinds-2145-rs.jpg
വിലങ്ങനെയുള്ള മറവുകള്‍
പ്രമാണം:Gardine.jpg
ഇതൊരു മറവല്ല


പ്രമാണം:Vorhang.jpg
കട്ടിയുള്ള ഷേഡ്
പ്രമാണം:Jalousie-1.jpg
കുറുകെയുള്ള മറവുകള്‍


പ്രമാണം:Some window blinds.JPG
ഷേഡ്, ഷട്ടര്‍, വിലങ്ങനെയും കുറുകനെയുമുള്ള മറവുകള്‍.
പ്രമാണം:Miniblinds detail of mechanism.jpg
മറവ് ചെറുമറവുകളുമായി ചേര്‍ന്നു നില്‍ക്കുമ്പോള്‍
"https://schoolwiki.in/index.php?title=സഹായം:പട്ടികകൾ&oldid=551" എന്ന താളിൽനിന്ന് ശേഖരിച്ചത്