8. lekcija. Nodalījums galvai un ķermenim
Deniss Fedotovs (deni2s), 03.07.2007., 13:40Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title=""Amēba"" height="23" width="16" />”, tad šī pamācība ir tieši tev!
(Te ir pieejama iepriekšējā lekcija - Kravājam čemodānu nosūtīšanai)
Domāju ka šī lekcija jums šķitīs elementāra (tāpat kā visas nākamās), jo mēs ļoti daudz runāsim par elementiem. Atgādināšu, ka iepriekšējā lekcijā mēs sākām apskatīt šādu kodu:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mana 1. lapa!</title>
</head>
<body>
</body>
</html>
Tikām līdz tam, ka apskatījām kodā elementu <html>, kurš ir kā čemodāns, kurš satur kopā pārējo lapas saturu.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Kā jau teicu, vienā xHTML koda elementā starp tā atverošo un aizverošo tagu var ievietot vienu vai vairākus citus elementus. Tagad aplūkosim xHTML kodu, kurš atrodas mūsu čemodānā - ievietots xHTML koda elementā <html> un centīsimies saskatīt, kādus citus elementus tas satur.
<head>
<title>Mana 1. lapa!</title>
</head>
<body>
</body>
Pirmo saskatām elementu <head> (angļu valodā "head" nozīmē "galva"), kurš sastāv no:
-
atverošā taga
<head>, -
vēl cita elementa
<title>. Par elementu<title>mēs vēl parunāsim mazliet vēlāk, -
aizverošā taga
</head>.
Aiz elementa <head> seko vēl viens cits elements - <body> ("body" angļu valodā nozīmē "ķermenis"), kurš sastāv no atverošā taga un aizverošā taga. Bet tas nenozīmē, ka mūsu čemodāns ir paredzēts sadalītu līķu pārvadāšanai, kā kāds var nejauši padomāt izlasot elementu nosaukumus! Nebūt ne!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Secinājums: Čemodānam, kuru mēs kravājam pārlūkprogrammai, ir divi nodalījumi.
1. nodalījums (elements <head>) ir kā kabata, kurā var ievietot pavadzīmes un citus dokumentus. Šajā nodalījumā ievieto informāciju, kura ir domāta nevis attēlošanai mājaslapā, bet gan dažādus papildus datus, kurus mēs vēlamies nodot pārlūkprogrammai, lai pārlūkprogramma tos varētu izmantot. Kā jau minēju, pašlaik tur ir iekšā elements <title>, par kuru runāsim vēlāk, taču nākotnē ievietosim tur vēl dažus elementus.
2. nodalījums (elements <body>) ir paredzēts, citu xHTML elementu izvietošanai, kurus pārlūkprogrammai jāattēlo uz ekrāna. Redzat kāds pašlaik tur ir izvietots elements starp atverošo un aizverošo tagu? Es arī neredzu, jo pašlaik šis elements ir tukšs. Bet tas nekas, mēs to tā ilgi neatstāsim!
Nu ko, esam gandrīz izgājuši cauri visam dotajam xHTML kodam, izņemot to vienu rindiņu, kura satur <title> elementu. Esam tikuši līdz tam, ka mums ir:
-
uzlīme uz čemodāna,
-
čemodāns,
-
čemodānam nodalījums pavadzīmēm un citiem dokumentiem,
-
čemodāna otrs (parasti lielākais nodalījums), kurā var salikt daudz ko citu iekšā.
Jāatcerās, ka kodā šo elementu secību nedrīkst mainīt! Uzlīmei jābūt pa virsu čemodānam, un čemodāna nodalījumiem jābūt tieši tādā kārtībā: No sākuma pavadzīmju nodalījums (elements <head>) un pēc tam otrs nodalījums (elements <body>).
Un ceru, ka nevienam no jums neienāca prātā, piemēram, ievietot elementu <body> iekš elementa <head> šādi:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mana 1. lapa!</title>
<body>
</body>
</head>
</html>
Tas ir nepareizi! Vēl cita kļūda, kuru bieži pielaiž, ir dīvaini sakombinēt elementus, ka tie atrodas nevis viens otrā, bet gan kaut kā samuhļīti savā starpā. Piemēram, pamēģiniet noteikt, vai zemāk redzamajā kļūdainajā kodā elements <body> atrodas iekš elementa <head> vai arī elements <head> atrodas iekš elementa <body>?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mana 1. lapa!</title>
<body>
</head>
</body>
</html>
Kā redzat, to nemaz nevar viennozīmīgi pateikt, tāpēc, ja jūs rakstīsiet šādu aplamu kodu, kā dotajā nepareizajā piemērā, tad nebrīnieties, ja pārlūkprogramma atveidos jūsu veidoto mājaslapu pavisam ne tā, kā jūs to gaidījāt!
Ja jūs nesapratāt par ko es runāju, tad pamēģiniet šajā piemērā apvilkt visu elementu <head> (ar atverošo un aizverošo tagu un visu kas ir starpā), un tad līdzīgi apvilkt visu elementu <body>. Jūs redzēsiet, ka to nav iespējams izdarīt tā, lai līnijas nekrustotos! Ja līnijas krustojas, tātad elementi nav ievietoti korekti viens otrā! Viens no xHTML kodēšanas pamatprincipiem ir, ka elementi ir jāievieto korekti viens otrā!
Šķiet, ka nākamreiz būs jādod praktiskais darbs...
Turpinājums sekos...
web.hc.lv ir vortāls, kurā tiek aplūkoti mājaslapu veidošanas un mārketinga aspekti, no idejas līdz gandarījumam.