Cпонсор публікації:
Пограти в ігри онлайн та флеш ігри на порталі games.in.ua
Шаблони для веб-сайтів на будь-який смак (Вордпрес, Джумла, Друпал, Флеш тощо). Шаблони, щоб не гаяти часу.
Ця стаття по суті є продовженням нещодавньої публікації про основний набір тегів для роботи з HTML. Сьогодні я розповім про використання кодових позначень символів, які суттєво спрощують життя блогера у дуже багатьох випадках. А якщо час від часу вам доводиться публікувати код html – тоді без цифрових аналогів вам просто не обійтися.
Потреба використання кодових позначень символів виникає тоді, коли вам потрібно вжити нестандартний чи нетиповий символ, якого немає в клавіатурній розкладці: наприклад знак євро (€), «плюс-мінус» (±) чи той же копірайт (©).
Деякі символи, такі як нерозривний пробіл, взагалі неможливо ввести у html ніяк інакше, ніж кодовим шифром. І якщо ви не знатимете його коду, то ніяк не зможете дотриматися правил стилістичного та есетичного оформлення тексту.
Але звісно ж, найбільш корисною інформація щодо кодових аналогів основних символів html буде для тих, хто публікує багато прикладів коду. Ви й самі, мабуть, неодноразово стикалися з ситуацією, коли намагаючись поділитися з товаришем в коментарях до статті шматком html-коду отримували не код, а його інтерпретацію.
Та це й логічно – звідки комп’ютеру знати, що ви хочете показати користувачеві саме код? Він бачить знайомі „позивні” і інтерпретує код, замість того, щоб публікувати його.
На щастя існує простий спосіб уникнути такої ситуації: все, що вам потрібно – це замінити деякі ключові символи їхніми цифровими аналогами – і машина перестане інтерпретувати їх як код. А ви зможете опублікувати будь-які фрагменти коду, не боячись, що читач нічого не побачить, або побачить зовсім не те, що ви мали намір показати.
Як публікувати код html на сайті?
Спробуйте ввести в форму коментарів під цією статтею стрічку:
<img src="http://blogosphere.com.ua/wp-content/uploads/2011/01/html-code.jpg">
та натисність кнопочку „Перегляд” (тільки не потрібно публікувати такі коментарі).
Якщо ви все зробили правильно, то у формі перегляду відобразилося зображення із першого абзацу цієї статті. Це добре, якщо ви хотіли досягнути саме такого ефекту! Але що, якщо ви хотіли опублікувати html-код, а не зображення?
Для того, щоб браузер перестав інтерпретувати рідний для нього html-код (тобто видавати результат його виконання, а не сам код) – потрібно пошкодити його структуру. Для цього замінимо відкриваючий та закриваючий теги (знаки „менше” та „більше”) їхніми кодовими аналогами. Отримаємо наступний результат:
<img src="http://blogosphere.com.ua/wp-content/uploads/2011/01/html-code.jpg">
Спробуймо переглянути через форму коментарів…
Тепер html-код більше не інтерпретується, а видається у своєму первозданному вигляді. Все що робить браузер – це замінює кодові позначення знаків < та > їхніми символьними аналогами (знаки „менше” та „більше” відповідно). А ми, в свою чергу, отримуємо саме те, чого прагнули – коректний html-код.
Скажу по секрету, що для публікації html-коду практично будь-якої складності достатньо замінити тільки всі знаки „менше”, а знаки „більше” залишити у спокої. У більшості випадків цього вистачить для того, щоб код правильно відображався.
Таблиця символьних кодів HTML
А тепер головне – таблиця кодів HTML, які ви можете використовувати на свій смак та розсуд. Я спеціально вибрав лише найбільш використовувані, і проігнорував вкрай рідкісні та екзотичні символи із юнікоду чи китайські ієрогліфи, інакше таблиця розрослася б до неймовірних розмірів і знайти у ній щось було б нереально. Втім, можу закластися, що у 99% ви знайдете тут необхідний символ.
Зверніть увагу, що деякі знаки мають як словесні, так і кодові аналоги (це найбільш розповсюджені знаки), а деякі – тільки кодові.
Користуйтеся на здоровя:
Знак | Код 1 | Код 2 | Опис |
---|---|---|---|
|   | нерозривний пробіл | |
  | вузький пробіл (шириною в букву n) | ||
  | широкий пробіл (шириной в букву m) | ||
– | – | вузьке тире (en-тире) | |
— | — | широке тире (em -тире) | |
© | © | © | копірайт |
® | ® | ® | Знак (R) – зареєстровано |
‰ | ‰ | ‰ | проміле |
π | π | π | пі |
§ | § | § | знак параграфа |
° | ° | ° | знак градусу |
´ | ´ | знак наголосу | |
× | × | × | знак множення |
÷ | ÷ | ÷ | знак ділення |
< | < | < | менше (відкриваючий знак для html-тегів) |
> | > | > | більше (закриваючий знак для html-тегів) |
± | ± | знак “плюс мінус” | |
− | − | знак мінус | |
≤ | ≤ | менше чи рівно | |
≥ | ≥ | більше чи рівно | |
≈ | ≈ | приблизно рівно | |
≠ | ≠ | не рівно | |
€ | € | € | Євро |
¢ | ¢ | ¢ | Цент |
£ | £ | £ | Фунт |
¤ | ¤ | знак валюти | |
¥ | ¥ | ¥ | знак єни та юаня |
” | " | " | подвійні лапки |
& | & | & | амперсанд |
« | « | « | ліва типографська лапка |
» | » | » | права типографська лапка |
← | ← | стрілка ліворуч | |
↑ | ↑ | стрілка вгору | |
→ | → | стрілка праворуч | |
↓ | ↓ | стрілка вниз | |
↔ | ↔ | стрілка ліворуч і праворуч |
Знаете ли вы, что такое болезнь паркинсона? Узнайте больше о симптомах и лечении на сайте Healthis.ru
Схожі записи
Якщо вам сподобалася стаття, буду вдячний за її підтримку у соціальних мережах (Twitter, Facebook, Google+ та вКонтактє)