Пачаткоўцам вэбмайстрам даводзіцца сутыкацца са мноствам праблем. Здавалася б, сёння ўжо можна выкарыстоўваць для стварэння сваіх сайтаў шаблоны, але вось бяда, далёка не заўсёды яны валодаюць патрэбнымі ўласцівасцямі, і тады даводзіцца або ствараць дызайн сайта з чыстага ліста, альбо ж ўносіць змены ва ўжо існуючы код. Тут-то і спатрэбіцца веданне HTML-кода і мінімальныя ўяўленні аб тым, як задаць фон і колер старонкі, ўставіць малюнак або відэа, зрабіць табліцу ў HTML.
Пачатак працы над табліцай
Адна з найбольш складаных рэчаў у разметцы HTML-старонкі - табліцы. І праблема не ў складанасці тэгаў, якія, па сутнасці, не так ужо і цяжка запомніць, а ў тым, што пры напісанні кода можна лёгка дапусціць памылкі - забыцца прапісаць лішнюю радок або вочка, ўпісаць тэкст не туды, куды трэба, і іншыя дробязі . Прычым чым больш табліца, тым больш шанец памыліцца.
Таму, прыступаючы да стварэння табліцы ў HTML, рэкамендуем максімальна засяродзіцца і не адцягвацца.
У першую чаргу варта накрэсліць будучую табліцу на аркушы паперы, пазначыўшы, што і ў якой вочку ў вас будзе знаходзіцца, а таксама адзначыўшы для сябе асноўныя параметры таго ці іншага элемента.
Далей варта падлічыць колькасць радкоў у табліцы, а таксама колькасць вочак у кожнай радку. Таксама рэкамендуем адзначыць такія пункты, як наяўнасць малюначкаў у табліцы, колер фону, межаў, тэксту. Толькі пасля гэтага можна пачынаць ствараць у HTML табліцу, выкарыстоўваючы запісаную інфармацыю.
рэдактар
Такім чынам, вы стварылі макет табліцы. Цяпер трэба будзе выбраць прыдатны рэдактар для яе стварэння. Можна выбраць спецыяльныя канструктары сайтаў і рабіць табліцу ў іх. Выкарыстоўваючы дадзенае праграмнае забеспячэнне, стварыць табліцу не складаней, чым у дакуменце Word. Можна выбраць такую праграму, як FrontPage. Нягледзячы на тое што праграма даволі старая, з яе дапамогай можна ствараць нядрэнныя сайты, да таго ж па ёй можна знайсці не адзін дапаможнік.
Калі вы хочаце стварыць у HTML табліцу пры дапамозе адмысловага кода, можна выкарыстоўваць для гэтых мэтаў і звычайны нататнік ці звычайны дакумент Word. Праўда, тут вам прыйдзецца папрацаваць, так як пісаць код прыйдзецца доўга.
Можна скарыстацца рэдактарам, убудаваным у сам рухавічок сайта. Так, пры стварэнні запісу ў многіх рухавічках прадугледжана магчымасць дадання розных элементаў, у тым ліку і табліц. Нават калі базавыя магчымасці рэдактара вас не задаволяць, унесці змены ў код будзе лягчэй, чым напісаць яго з нуля.
Тэгі
Па-за залежнасці ад таго, якім рэдактарам вы будзеце карыстацца, перад тым як вы пачнеце ствараць у html табліцу, вам варта запомніць асноўныя тэгі. Усяго іх тры -
,
і
. Адзначым, што усе тэгі з'яўляюцца парнымі. Першы тэг пазначае табліцу ў цэлым, другі задае радок, трэці - вочка ўнутры радка.
Трохі падрабязней пра кожнага з тэгаў. Табліца заўсёды пачынаецца з тэга
і заканчваецца table>. Для любога браўзэра гэта ўмоўнае пазначэнне таго, што перад ім знаходзіцца менавіта табліца. Далей прапісваюцца радкі, якія адкрывае
і заканчвае тэг tr>. У кожнай радку з дапамогай тэгаў
і td> прапісваецца колькасць вочак.
Такім чынам, код табліцы 2х2 будзе выглядаць такім чынам:
Td>
td> tr>
td>
td> tr>
Table>
Ўставіць табліцу ў HTML-код старонкі можна, скапіяваўшы яго з абранага рэдактара.
Параметры табліц, радкоў і ячэек
Такім чынам, базавы код мы разабралі. Зараз пагаворым аб тым, як палепшыць табліцу, зрабіць яе ярчэй і прывабней. Для гэтага трэба ведаць асноўныя параметры тэгаў. Яны прапісваюцца ўнутры адкрывае тэга, пры гэтым пасля кожнага параметру ставіцца знак роўнасці, а затым прапісваецца яго значэнне, узятае ў двукоссі. Напрыклад, фон у табліцы HTML задаецца так:
.
Пералічым некалькі асноўных параметраў, якія будуць найбольш карысныя для вас. Пачнем з самай табліцы.
Так, задаць шырыню мяжы дапаможа параметр border, які можа прымаць любое лікавае значэнне. Колер мяжы задае bordercolor. Агульны фон задае bgcolor.
Калі ж вы хочаце зрабіць фонам табліцы малюнак, выкарыстоўвайце background, пры гэтым вам варта прапісаць URL малюнка.
Выраўнаваць змесціва старонкі вакол табліцы дапаможа параметр align, які можа прымаць значэнні left, center і right.
Задаць загаловак дапаможа парны тэг
, які прапісваецца адразу пасля які адкрывае тэга
.
Трохі пра параметры радка. Колер вочак у радку задаецца з дапамогай bgcolor. Выраўноўванне тэксту па гарызанталі можна зрабіць з дапамогай параметру align (left, center ці ж right), па вертыкалі - valign (прымае значэння top, middle або bottom).
Датычна вочка можна адзначыць, што колер фону і фонавы малюнак задаецца для яе з дапамогай тых жа параметраў, што і для ўсёй табліцы. Выраўнаваць тэкст можна з дапамогай параметраў align і valign.
Ёсць і асаблівыя параметры - colspan і rowspan. З дапамогай першага можна задаць колькасць слупкоў, на якія будзе распасцірацца вочка. Другі ж задае колькасць радкоў, на якія дадзеная вочка можа распасцірацца.
Вось і ўсё найбольш карысныя параметры.
табліца кветак
Скажам некалькі слоў пра такую карыснай рэчы, як табліца кветак. З яе дапамогай задаецца фон старонкі, колер тэксту, спасылак і іншых элементаў. Табліца кветак змяшчае каля 216 кветак і адценняў. Кожны з іх мае свой шаснаццатковы код.
Сам код пачынаецца са знака рашоткі і змяшчае тры пары лічбаў або літар. Напрыклад, зялёны колер у табліцы мае код # 007F0. Кожная пара пазначае інтэнсіўнасць аднаго з трох асноўных колераў - чырвонага, зялёнага і сіняга. Выкарыстоўваючы табліцу, можна абраць патрэбны вам колер і задаць яго з дапамогай кода.
У выпадку, калі ў вас няма магчымасці скарыстацца табліцай, можна задаць колер з дапамогай яго назвы на англійскай мове.
змесціва
Некалькі слоў пра самы змесціве. Вядома ж, найбольш часта мы можам убачыць тэкст у табліцы HTML, але гэта не значыць, што толькі яго мы і можам туды змясціць. Вочкі і радкі могуць утрымліваць таксама малюнкі, аўдыё і відэафайлы, спасылкі.
Для таго каб змясціць тэкст або любую іншую інфармацыю ў вочка (радок), варта прапісаць яе паміж двума тэгамі. Напрыклад:
назва td>. У вочку адлюструецца «Імя».
Змясціць графічную інфармацыю і медыяфайлы можна з дапамогай спецыяльных тэгаў - ,
парады
Напрыканцы дамо некалькі карысных саветаў, якія дапамогуць вам хутка стварыць у HTML табліцу любой складанасці.
Пры напісанні табліцы раім спачатку прапісаць самі тэгі табліцы і асноўныя яе параметры. Затым прапішіце тэгі радкоў. Кожную пару пачынайце з новага радка. Так вы будзеце бачыць, колькі радкоў у вашай табліцы. Таксама прапішіце параметры радкі або радкоў, калі яны адрозніваюцца ад асноўных. Затым раім пачынаць прапісваць кожнае вочка, таксама з новага радка. Прычым пажадана рабіць адзін ці два водступу Tab ад краю. Такім чынам, вы будзеце даволі выразна бачыць структуру кода.
Змесціва вочак і радкоў раім прапісваць ўжо ў самым канцы, калі каркас табліцы гатовы.