Кампутары, Праграмаванне

Як зрабіць табліцу ў HTML: падрабязнае апісанне

Табліцы - адны з найбольш важных, але ў той жа час складаных элементаў, якія павінны прысутнічаць на вэб-старонках. З іх дапамогай зручна падаваць важную і карысную інфармацыю ў даволі сціснутай форме. Вядома, большасць рэдактараў у шаблонах, якія працуюць на розных рухавічках, дазваляюць аўтаматычна ўстаўляць табліцу на старонку сайта або асобнай публікацыі, але што, калі дызайн вэб-рэсурсу, яго старонкі ствараюцца з нуля? Тады перад пачаткоўцам майстрам можа ўстаць праблема: як зрабіць табліцу ў HTML. Давайце разбярэмся, як жа правільна і хутка стварыць дадзены элемент.

выбіраем рэдактар

У першую чаргу, прыступаючы да стварэння табліцы, варта вызначыцца з рэдактарам, у якім вы будзеце працаваць. Вядома, прасцей за ўсё абраць тую праграму, у якой вы ствараеце асноўнай код сайта. Але лепш за ўсё выкарыстоўваць для гэтых мэтаў стары добры нататнік.

Вы можаце спытаць, для чаго абцяжарваць сваё жыццё, бо калі рабіць усё адразу ў рэдактары, то і вынік можна ўбачыць таксама адразу, яшчэ і падказкі праграмы выкарыстоўваць.

Так, гэта сапраўды так, але, ствараючы табліцу з чыстага ліста, вы не толькі зможаце дасканала вывучыць сам прынцып яе стварэння, але і не дапусціць прыкрых памылак друку і памылак у асноўным кодзе. Часам здараецца так, што курсор выпадкова перамяшчаецца ўніз, і ў працэсе напісання ў код закрадаецца памылка, якую часам складана знайсці. Стварыўшы табліцу ў нататніку, вы зможаце скапіяваць яе шыфр і ўставіць у патрэбнае вам месца.

Алгарытм стварэння табліцы

Для пачатку складзем кароткі алгарытм, як зрабіць табліцу ў HTML. Гэта трэба для таго, каб вы разумелі паслядоўнасць кожнага кроку. Затым разбяром, як менавіта выконваць кожны з пунктаў.

Пачнем з падрыхтоўчых дзеянняў.

1. Малюем на аркушы паперы схематычны малюнак табліцы.

2. Падлічваем колькасць радкоў і ячэек. Калі колькасць апошніх рознае - лічым для кожнага рядочка асобна.

3. Вызначаем ў радку колькасць вочак-загалоўкаў (да прыкладу, ячэйкі «№», «Імя» і т. Д.).

4. Запісваем асноўныя параметры табліцы - колер, вышыню і шырыню, выраўноўванне тэксту - увогуле, усё, што вам здасца патрэбным.

Далей пераходзім непасрэдна да стварэння табліцы:

1. Устаўляемы тэгі табліцы.

2. Устаўляемы тэгі радкоў зыходзячы з той колькасці, якое вам трэба.

3. У радках вставляем тэгі вочак (звычайных і загалоўных), таксама зыходзячы з той колькасці, якое запісана ў вас на паперы.

4. Задаем параметры для табліцы ў цэлым.

5. Пры патрэбе задаем паказчыкі для асобных вочак.

6. Запаўняем нашы ячэйкі тэкстам.

ствараем табліцу

Такім чынам, вы абралі рэдактар, зараз давайце разбярэмся, як стварыць табліцу ў HTML. Тэг, з дапамогай якога ў код старонкі ўстаўляецца табліца (

), з'яўляецца парным, то ёсць пачынаецца наша канструкцыя з дадзенага тэга, а заканчваецца .

Уставіўшы тэгі табліцы, пераходзім да стварэння радкоў і ячэек.

Адразу адзначым, што дадзеныя элементы таксама з'яўляюцца парнымі. Тэг

задае радкі, а
- вочка.

Для загалоўных вочак варта выкарыстоўваць парны элемент

.

Як ужо гаварылася, перш за ўсё варта аформіць радкі, затым у іх прапісваць ўжо вочка. Для таго каб не заблытацца, раім рабіць альбо водступы паміж кожным блокам у адну-два радкі, альбо ж прапісваць новы блок элементаў, выкарыстоўваючы клавішу "Tab".

Як гэта можа выглядаць? Прыкладна так: