Ja esat ticis cauri citiem HTML Fundamentals sērijas komponentiem, jūs zināt, kā formatēt tekstu, pievienot attēlus un izveidot saites. Nākamais solis ir iemācīties salikt šos gabalus tīmekļa vietnē, lai iegūtu vēlamo izskatu.

Pastāv daudzi HTML elementi, kas palīdz formatēt dažādas lapas daļas; mēs pievērsīsim uzmanību diviem, kurus visbiežāk izmanto lapu sadaļu izkārtošanai. Divi galvenie izkārtojuma elementi ir tabula un div.

Kopš HTML sākuma tabulas ir izmantotas, lai elementus novietotu viens pret otru. Sākotnēji HTML tabula bija paredzēta datu parādīšanai un tamlīdzīgi, līdzīgi kā Excel izklājlapa. Tomēr tīmekļa dizaineri ātri saprata, ka var izmantot tabulas, lai attēlus un tekstu novietotu sarežģītākos izkārtojumos, nekā atļautu tagu un citu HTML elementu izmantošana.

HTML tabulā ir rindas (apzīmētas ar tagi), un šajās rindās ir kolonnas (apzīmētas ar tagi). Lielākajai daļai tabulu būs vairākas rindas un kolonnas, lai palīdzētu elementu pozicionēšanā. Pamata tabulas kods izskatās apmēram šādi:







Iepriekš minētais koda paraugs veidotu vienas rindas, vienas kolonnas tabulu. Varat izmantot vairākas rindas un kolonnas, lai izveidotu sarežģītāku tabulu teksta un attēlu novietošanai. Tabula ar vairākām rindām un kolonnām izskatās šādi:









   
   


Ievietojot tekstu un attēlus atbilstošās rindās un kolonnās, jūs varat šos elementus pēc vajadzības izvietot ap savu tīmekļa lapu. Tabulas var būt redzamas, tāpat kā iepriekšējā piemērā, ja robežu iestatāt uz "1" vai vairāk. Iestatot 'border = "0"', tiek izveidota neredzama tabula. Daudzas tīmekļa lapas sastāv no ligzdotām neredzamām tabulām, un vienā lielā tabulā ir galvenās lapas sadaļas (piemēram, izvēlnes) un mazākās tabulās, kuru iekšpusē ir galvenā lapas daļa.

Iekļaujot CSS (Cascading Style Sheets), div elements pats kļuva par izkārtojuma elementu. Tagad dizaineri var izmantot CSS, lai divs izvietotu noteiktās vietās ap lapu, un rezultāti ir vēl precīzāki, nekā tabulas var sasniegt. Piemēram, dizainers var izmantot šo div tagu, lai attēlu ievietotu Web lapas centrā:





Daudzi dizaineri pakāpeniski pārtrauc tabulas par labu divs. Tā kā viss ir vienāds, labāk ir izmantot kodēšanas praksi izkārtojumam izmantot divs un CSS, nevis atkarībā no tabulām. Galdi nebija paredzēti izmantošanai kā izkārtojuma rīks, un, izmantojot ligzdotas tabulas, piekļuves programmatūrai (piemēram, sarunu saskarnēm, kuras izmanto neredzīgie) būs grūti saprast jūsu vietni. No otras puses, ir iespējams pārāk tālu aiziet otrā virzienā. Ja jūs izmantojat desmit ligzdotas divs, lai izveidotu izkārtojumu, kuru izveidošanai varētu izmantot vienu tabulu, iespējams, ka jums labāk klājas ar tabulu.

How to speak so that people want to listen | Julian Treasure (Oktobris 2020)



Tags Rakstu: HTML pamati - izkārtojuma elementi, HTML, HTML, CSS, kaskādes stila lapas, tabula, tabulas, div, divs, div tagi, tabulas tagi, tabulas izkārtojums, div izkārtojums, tabulas rindas, tabulas kolonnas

Ja jūs kādu mīlat .....

Ja jūs kādu mīlat .....

grāmatas un mūzika

Datoru problēmas

Datoru problēmas

grāmatas un mūzika