Сутність блоку інформації
Термін “інформація” в інтернет-програмуванні має свій сенс. Це дані, певним чином структуровані і представлені. Інформація – це значно ширше поняття. У програмуванні веб-ресурсів цей термін несе в собі мінімально можливий зміст і обсяг.
Розмір і положення тега HTML div: width/height і left/top можуть бути абсолютними і відносними. Вкладаючи теги один в одного, можна маніпулювати положенням та розмірами. Змінюючи правило CSS position з absolute на relative, можна керувати положенням тегів по відношенню один до одного всередині вікна браузера.
Браузер як додаток несе у собі спадщину від локального програмування: це програма, в якій є вікно, в якому відображається мова гіпертексту, доповнений стилями CSS і жвавий роботою JavaScript-коду.
Можна згадати улюблене всіма компаніями (інтернет-студіями) поділ розробки на фронтенд і бекенд, але суті це не змінює. Не суть важливо, як блок виявився на HTML-сторінці: був написаний «ручками» або сформований як результат роботи PHP-скрипта на сервері. Важливо, що кожен тег div як HTML/CSS-композиція – це положення, розмір, колір (символ/фону), прозорість, трансформація, рух, межі та ін.
Атрибутів і можливостей для опису блоку інформації правила CSS надають велике безліч, а логіка HTML дає можливість використовувати діви як за прямим призначенням, так і за логікою і досвіду розробника.
Наприклад, div HTML – це:
- обгортка, тобто місце розміщення системи тегів;
- область розміщення точок для обробників JavaScript;
- «масив» тегів для обробки.
Перший варіант зручний, коли потрібна струнка композиція тегів, яку можна легко перемістити в потрібне місце, уточнивши координати лише обгортки: все, що всередині, переїде як є, автоматом.
Другий варіант, наприклад карта місцевості або будівля, в якій кожній точці на карті призначений свій обробник, а клік на квартирі або вікні будівлі повинен дати потрібну інформацію.
Третій варіант значно спрощує обробку колекцій тегів: замість того, щоб перебирати всю колекцію тегів div (body) HTML-сторінки, розробник може виконати пошук всередині одного тега, який невидимий і не чуємо, але включає в себе всі актуальні позиції.
