Ang mga attribute ng talahanayan ng HTML ay nagbibigay sa iyo ng mas maraming kontrol sa mga talahanayan ng HTML. Maraming mga katangian na magagamit sa mga talahanayan upang gawing mas kawili-wiling at baguhin ang hitsura ng iyong pahina.
HTML TALAAN Mga Katangian ng Elemento
Sa HTML5 ginagamit ng elemento ang mga global na katangian at isa pang katangian:. At ito ay nagbago upang magkaroon lamang ng halaga ng 1 o walang laman (hal. border = ""). Kung nais mong baguhin ang lapad ng hangganan, dapat mong gamitin ang hangganan-lapad Ari-arian ng CSS.
Tingnan sa ibaba upang malaman ang tungkol sa wastong mga katangiang talahanayan ng HTML5.
Mayroon ding ilang mga katangian na bahagi ng HTML 4.01 na detalye na naging lipas na sa HTML5:
- -Gamitin ang CSS
paddingari-arian sa mesaTDatTHmga elemento. - -Gamitin ang property ng CSS
hangganan-spacingsa mesa. - -Gamitin ang mga estilo ng CSS
hangganan-kulay: itim;atestilo ng hangganansa mesa. - -Gamitin ang mga estilo ng CSS
hangganan-kulay: itim;atestilo ng hangganansa naaangkop na mga elemento ng talahanayan. - -Sa halip, dapat mong ilarawan ang istraktura ng talahanayan sa isang
CAPTIONo ilagay ang buong talahanayan sa aPAGKAROONat naglalarawan nito sa isangFIGCAPTION. Bilang kahalili, maaari mong gawing simple ang istraktura ng talahanayan upang walang paliwanag ay kinakailangan. - -Gamitin ang CSS
lapadari-arian.
At isang katangian na hindi na ginagamit sa HTML 4.01 at hindi na ginagamit sa HTML5.
Matuto nang higit pa tungkol sa HTML 4.01 TALAAN Mga Katangian.
align-Gamitin ang CSSmarginari-arian sa halip.
Mayroon ding ilang mga katangian na hindi bahagi ng anumang detalye ng HTML. Gamitin ang mga katangiang ito kung alam mo na ang mga browser na sinusuportahan mo ay maaaring hawakan ang mga ito at wala kang pakialam tungkol sa wastong HTML.
- -Gamitin ang property ng CSS
kulay ng backgroundsa halip. bordercolor-Gamitin ang property ng CSShangganan-kulaysa halip.bordercolorlight-Gamitin ang property ng CSShangganan-kulaysa halip.bordercolordark-Gamitin ang property ng CSShangganan-kulaysa halip.cols-Walang alternatibo sa katangiang ito.taas-Gamitin ang property ng CSStaassa halip.- -Gamitin ang property ng CSS
marginsa halip. - -Gamitin ang property ng CSS
marginsa halip. - -Gamitin ang property ng CSS
puting-puwangsa halip. - -Gamitin ang property ng CSS
vertical-alignsa halip.
Matuto nang higit pa tungkol sa Mga Tukoy na Mga Katangian ng TAMPINAN ng Browser.
HTML5 TABLE Element attribats
Tulad ng aming nabanggit sa itaas, mayroon lamang isang katangian, lampas sa mga global na katangian, na wasto sa isang HTML5 TALAAN elemento: hangganan.
Ang hangganan Ang katangian ay ginagamit upang tukuyin ang isang hangganan sa paligid ng buong talahanayan at lahat ng mga selula sa loob nito. Mayroong ilang mga katanungan tungkol sa kung ito ay kasama sa pagtutukoy HTML5, ngunit ito ay nanatili dahil nagbigay ito ng impormasyon tungkol sa istraktura ng talahanayan, lampas lamang ng implikasyon ng estilo.
Upang idagdag ang hangganan katangian, itinakda mo ang halaga sa 1 kung may hangganan at walang laman (o iwanan ang katangian) kung wala. Sinusuportahan din ng karamihan ng mga browser 0 para sa walang hangganan, at anumang iba pang halaga ng integer (2, 3, 30, 500, atbp) upang idedeklara ang lapad ng border sa pixel, ngunit ito ay hindi na ginagamit sa HTML5. Sa halip, dapat mong gamitin ang mga katangian ng estilo ng border ng CSS upang tukuyin ang lapad ng border at iba pang mga estilo.
Upang lumikha ng isang table na may hangganan, isulat ang:
border = "1" >
Ito ay isang table na may hangganan
May mga HTML 4.01 na mga katangian na hindi na ginagamit sa HTML5. Kung plano mo sa pagsulat ng HTML 4.01 na mga dokumento, maaari mong malaman ang mga ito, kung hindi man, maaari mong huwag pansinin ang mga ito. Karamihan sa mga katangiang ito ay may mga alternatibo, na inilarawan sa itaas.
Inilarawan namin ang mga katangian ng sangkap na wasto sa HTML5 (at HTML 4.01). Inilalarawan nito angTALAAN mga katangian na wasto sa HTML 4.01, ngunit hindi na ginagamit sa HTML5. Kung sumulat ka pa rin ng mga HTML 4.01 na dokumento, maaari mong gamitin ang mga katangiang ito, ngunit karamihan sa mga ito ay may mga alternatibo na gagawing mas katibayan sa iyong mga pahina para sa kapag lumipat ka sa HTML5.
Mga wastong HTML 4.01 Mga Katangian
Ang katangian na inilarawan natin sa itaas. Ang pagkakaiba lamang sa HTML 4.01 mula sa HTML5 ay maaari mong tukuyin ang anumang buong integer (0, 1, 2, 15, 20, 200, atbp.) Upang tukuyin ang lapad ng hangganan sa mga pixel.
Upang bumuo ng isang table na may 5px border, isulat ang:
<> border = "5" > Ang mesa na ito ay may 5px na hangganan.
Tingnan ang isang halimbawa ng dalawang talahanayan na may mga hangganan.
Ang katangian ay tumutukoy sa dami ng espasyo sa pagitan ng mga hangganan ng cell at ng mga nilalaman ng cell. Ang default ay dalawang pixel. Itakda angcellpadding sa0 kung gusto mong walang espasyo sa pagitan ng mga nilalaman at mga hangganan.
Upang i-set ang cell padding sa 20, isulat ang:
<> cellpadding = "20" > Ang mesa na ito ay may cellpadding ng 20. Ang mga hangganan ng cell ay ihihiwalay ng 20 na pixel.
Tingnan ang isang halimbawa ng isang table na may cellpadding
Tinutukoy ng katangian ang halaga ng espasyo sa pagitan ng mga selula ng talahanayan at ng nilalaman ng cell. Katuladcellpadding, ang default ay naka-set sa dalawang pixel, kaya dapat mong itakda ito sa0 kung gusto mo walang cell spacing.
Upang magdagdag ng cell spacing sa isang table, isulat ang:
<> cellspacing = "20" > Ang mesa na ito ay may cellspacing ng 20. Ang mga cell ay ihihiwalay ng 20 pixels.
Tingnan ang isang table na may cellspacing
Kinikilala ng katangian kung aling mga bahagi ng hangganan na nakapalibot sa labas ng isang talahanayan ay makikita.Maaari mong i-frame ang iyong talahanayan sa lahat ng apat na panig, anumang bahagi, tuktok at ibaba, kaliwa at kanan, o wala.
Narito ang HTML para sa isang table na may lamang sa kaliwang gilid hangganan:
frame = "lhs" >
Ang mesa na ito Magkakaroon tanging ang kaliwang gilid naka-frame.
At isa pang halimbawa sa ilalim na frame:
frame = "sa ibaba" >
Ang mesa na ito ay may isang frame sa ibaba.
Tingnan ang ilang mga talahanayan na may mga frame
Ang katangian ay katulad ngframe katangian, nakakaapekto lamang ito sa mga hanggahan sa paligid ng mga selula ng talahanayan. Maaari kang magtakda ng mga panuntunan sa lahat ng mga cell, sa pagitan ng mga haligi, sa pagitan ng mga grupo tulad ngTBODY atTFOOT o wala.
Upang bumuo ng isang table na may mga linya lamang sa pagitan ng mga hilera, isulat ang:
mga panuntunan = "mga hilera" >
Mayroong 4x4 table na ito ang mga hanay ay hindi mga haligi na nakabalangkas sa katangian ng mga panuntunan.
At isa pa sa mga linya sa pagitan ng mga haligi:
mga panuntunan = "cols" >
Ito ay isang mesa kung saan ang mga haligi ay naka-highlight
Narito ang isang halimbawa ng isang table na may mga panuntunan
Ang katangian ay nagbibigay ng impormasyon tungkol sa talahanayan para sa mga mambabasa ng screen at iba pang mga ahente ng gumagamit na maaaring magkaroon ng problema sa pagbabasa ng mga talahanayan. Upang gamitin angbuod katangian, isulat mo ang isang maikling paglalarawan ng talahanayan at ilagay iyon bilang halaga ng katangian. Ang buod ay hindi ipapakita sa web page sa karamihan ng mga karaniwang web browser.
Narito kung paano sumulat ng isang simpleng mesa na may buod:
<> buod = "Ito ay isang sample na talahanayan na naglalaman ng impormasyon ng tagapuno. Ang layunin ng talahanayan na ito ay upang ipakita ang isang buod." > haligi 1 hanay 1 haligi 2 hanay 1 haligi 1 haligi 2 haligi 2 hilera 2
Tingnan ang isang talahanayan na may buod
Tinutukoy ng katangian ang lapad ng talahanayan sa alinman sa mga pixel o bilang isang porsyento ng elemento ng lalagyan. Kung anglapad ay hindi naka-set, ang talahanayan ay kukuha lamang ng espasyo habang kailangan nito upang ipakita ang mga nilalaman, na may isang maximum na lapad katulad ng lapad ng elemento ng magulang.
Upang bumuo ng isang table na may isang partikular na lapad sa pixel, isulat ang:
<> width = "300" > Ang mesa na ito ay 80% ng lapad ng lalagyan na ito.
At upang bumuo ng isang table na may isang lapad na isang porsyento ng elemento ng magulang, isulat ang:
<> lapad = "80%" > Ang mesa na ito ay 80% ng lapad ng lalagyan na ito.
Tingnan ang isang halimbawa ng isang table na may lapad
Deprecated HTML 4.01 TABLE Attribute
May isang katangian ngTALAAN elemento na hindi na ginagamit sa HTML 4.01 at hindi na ginagamit sa HTML5:align. Hinahayaan ka ng katangiang ito na itakda mo kung saan naroroon ang talahanayan sa pahina na may kaugnayan sa teksto na nasa tabi nito. Ang katangiang ito ay hindi na ginagamit sa HTML 4.01, at dapat mong iwasan ang paggamit nito. Sa halip, dapat mong gamitin ang CSS property o angmargin-left: auto; atmargin-right: auto; estilo. Anglumutang ari-arian ay nagbibigay sa iyo ng isang resulta na mas malapit sa kung ano angalign Ang katangian ay ibinigay, ngunit maaaring makaapekto ito sa paraan ng pagpapalabas ng iba pang nilalaman ng pahina. Angmargin-right: auto; atmargin-left: auto; ay kung ano ang inirerekomenda ng W3C bilang isang alternatibo.
Narito ang isang deprecated halimbawa gamit angalign katangian:
<> align = "right" > Ang mesa na ito ay nakahanay nang tama Ang teksto ay dumadaloy sa paligid nito sa kaliwa
Tingnan ang isang hindi na ginagamit na halimbawa gamit angalign katangian.
At upang makakuha ng parehong epekto sa wastong (hindi na-deprecated) HTML, isulat ang:
<> style = "float: right;" > Ang mesa na ito ay nakahanay nang tama Ang teksto ay dumadaloy sa paligid nito sa kaliwa
Ang mga sumusunod ay nagpapaliwanagTALAAN mga katangian na hindi bahagi ng anumang detalye ng HTML.
Ang nakaraang impormasyon ay naglalarawan ng mga katangian ng elemento ng HTML na wasto sa HTML 4.01 ngunit hindi na ginagamit sa HTML5.
Ang sumusunod ay naglalarawanTALAAN mga katangian na hindi wasto sa anumang kasalukuyang detalye. Kung hindi mo pag-aalaga ang tungkol sa kung napatunayan ng iyong mga pahina at gumagamit ang iyong mga gumagamit ng browser na sumusuporta sa mga elementong ito, maaari mong gamitin ang mga elementong ito. Ngunit karamihan sa kanila ay alinman sa hindi suportado sa mga modernong browser o may mga alternatibo na mas maraming mga pamantayan-sang-ayon.
Hindi namin inirerekumenda ang paggamit ng mga katangiang ito sa iyong mga talahanayan ng HTML.
Ang katangian ay isang lumang attribute na kasama bago ang CSS ay malawak na suportado. Pinapayagan ka nitong baguhin ang kulay ng background ng talahanayan. Maaari kang magtakda ng isang pangalan ng kulay o isang hexadecimal code. Ang katangian na ito ay gumagana pa rin sa maraming mga browser, ngunit para sa hinaharap-proofed HTML, hindi mo dapat gamitin ito, at gamitin ang CSS sa halip.
Ang mas mahusay na alternatibo sa katangiang ito ay ang estilo ng ari-arian.
Upang baguhin ang kulay ng background ng isang talahanayan, isulat ang:
<> style = "background-color: #ccc;" > Ang mesa na ito ay may kulay abong background
Katulad ngbgcolor katangian, angbordercolor Hinahayaan ka ng katangian na baguhin mo ang kulay ng katangian. Ang katangiang ito ay sinusuportahan lamang ng Internet Explorer. Sa halip, dapat mong gamitin ang ari-arian estilo ng hangganan-kulay.
Upang baguhin ang kulay ng hangganan ng iyong talahanayan, isulat ang:
style = "border-color: red;" >
Ang mesa na ito ay may pulang hangganan.
Angbordercolorlight atbordercolordark Ang mga katangian ay kasama sa Internet Explorer upang pahintulutan kang lumikha ng 3D na hangganan sa paligid ng iyong talahanayan. Gayunpaman, tulad ng IE8 at up, ito ay sinusuportahan lamang sa IE7 Pamantayan ng Mode at Quirks Mode. Sinasabi ng Microsoft na ang mga pag-aari na ito ay hindi na suportado.
Sa maikling panahon, angcols katangian saTALAAN ang elemento ay iminungkahi upang matulungan ang mga browser na malaman kung gaano karaming mga haligi ang may mesa. Ang saligan ay na ito ay makakatulong mapabilis ang pag-render ng mga malalaking talahanayan. Gayunpaman, ito ay ipinatupad lamang ng Internet Explorer, at sa IE8 at up, ito ay sinusuportahan lamang sa IE7 Standards Mode at Quirks Mode.
Dahil mayroong isanglapad katangian (hindi na ginagamit sa HTML5) maraming mga tao assumed nagkaroon ng isangtaas katangian din para sa mga talahanayan. Ngunit dahil ang mga talahanayan ay sumunod sa lapad ng kanilang nilalaman o ang tinukoy na lapad sa CSS olapad katangian, ang taas ay hindi maaaring napigilan. Kaya sa halip, pinapayagan ng mga browser angtaas katangian upang tukuyin ang minimum na taas ng talahanayan. Kung ang talahanayan ay mas mataas kaysa sa taas na iyon, ito ay magiging mas mataas. Ngunit dapat mong gamitin ang ari-arian
Gamit ang CSStaas ari-arian na maaari mong pilitin ang taas kung gagamitin mo ang CSS property pati na rin upang tukuyin kung ano ang mangyayari sa anumang labis na nilalaman.
Upang itakda ang minimum na taas sa isang talahanayan, isulat ang:
<> style = "height: 30em;" > Ang mesa na ito ay hindi bababa sa 30 em mataas.
Ang dalawang katangian at idinagdag ang puwang sa palibot ng kaliwa / kanang gilid (hspace) at itaas / ibaba (vspace) ng talahanayan. Dapat mong gamitin ang estilo ng ari-arian sa halip.
Upang itakda ang vertical space sa 20 pixels at ang pahalang na espasyo hanggang 40 pixels, isulat ang:
<> style = "margin: 20px 40px;" Ang mesa na ito ay may isang vspace ng 20 pixels at isang hspace ng 40 pixels.
Ang attribute ay isang katangian ng boolean na tumutukoy kung ang mga nilalaman ng talahanayan ay dapat na balutin sa gilid ng elemento ng magulang o window o puwersahin ang pahalang na pag-scroll. Sa halip, dapat mong tukuyin ang mga katangian ng pambalot ng bawat cell ng talahanayan gamit ang CSS property.
Upang gumawa ng haligi na may maraming teksto na hindi balutin, isulat ang:
<> style = "white-space: nowrap;" > Ito ay isang hanay na may isang tonelada ng nilalaman. Ngunit kahit na mas malawak kaysa sa lalagyan ang teksto ay hindi dapat i-wrap sa susunod na linya, ngunit sa halip ay pilitin ang window ng browser upang mag-scroll nang pahalang upang makita ang lahat ng nilalaman.
Sa wakas, ang katangian ay tumutukoy kung paano dapat ihanay ng mga nilalaman ng bawat cell patayo sa loob ng cell. Sa halip na di-wastong katangian na ito, dapat mong gamitin ang property ng CSS sa bawat cell na gusto mong baguhin ang pagkakahanay ng. Hindi mo mapansin ang mga epekto ng estilo na ito maliban kung ang mga nilalaman ng cell ay mas mababa kaysa sa magagamit na espasyo na nilikha ng iba, mas malaking mga cell.
Upang pilitin ang isang cell na ihanay sa ibaba (sa halip na sa gitna, bilang default), isulat ang:
Ang cell na ito ay mas mahaba kaysa sa iba pa at sa gayon ay pilitin ang taas na maging mas mataas. Kaya makikita mo na ang nakahanay na vertically align ay nakahanay sa ilalim. <> style = "vertical-align: bottom;" > Mga nilalaman sa ibaba. Mga nilalaman sa gitna.
