Спецсимволы в HTML
Очень часто при написании кода HTML приходится выводить спецсимволы. Например, при написании статей для этого сайта, мне часто приходится писать, например, "<html>". Как вывести данный тег? Разумеется, если Вы в HTML-коде просто напишите "<html>", то браузер будет его интерпретировать как системный. Как поступить в данной ситуации? Ответ на этот вопрос находится в этой статье.
Я Вам покажу далеко не все спецсимволы в HTML, так как их достаточно много, а вот самые основные в таблице ниже:
Вид символа | Имя символа |
© | copy |
® | reg |
™ | trade |
∞ | infin |
> | gt |
< | lt |
& | amp |
€ | euro |
§ | sect |
А теперь разберём один простой пример на использование спецсимволов в HTML. Например, выведем вот такой код:
<p>
<span>Текст</span>
</p>
HTML-код, необходимый для того, чтобы вывести текст выше:
<p><br> <span>Текст</span><br></p>
Если вдруг, кто забыл или не знает, то " " - это обычный пробел (тоже спецсимвол). Просто ввиду того, что все теги, кроме (<pre>) вырезают лишние пробелы, то для вывода 2-х и более подряд идущих пробелов необходимо использовать эту сущность. Как можно понять из примера, для вывода спецсимвола необходимо соблюдать следующий синтаксис:
&имя_символа;
Если Вам потребуются ещё какие-нибудь символы, то можете поискать в Интернете, а самые основные я Вам уже дал.
-
- Михаил Русаков
Комментарии (33):
Я не понял куда <p><br> <span>Текст</span><br></p> вставлять?
Ответить
HTML-код который куда его
Ответить
В исходник HTML, в результате отображения данного кода в браузере появится все теги, но они уже будут выводиться как текст, а не восприниматься, как разметка документа.
Ответить
Да не получается ,вот что получается <p> <span>Текст</span> </p> Текст
Ответить
Так это и должно было появиться. Смысл всех этих спецсимволов, чтобы выводить HTML-текст в браузере. По-другому, Вы бы не вывели данный текст на страницу.
Ответить
не понял
Ответить
Миша Смотри что получается это мой домен http://mywork.hdd1.ru/
Ответить
Совершенно верно! Это и должно было получиться. Вы вывели HTML-теги в виде текста на страницу. Это нужно, например, мне, чтобы выводить статьи с HTML-тегами. Если я их просто начну писать в коде, то они не выведутся, а воспримутся, как системные.
Ответить
А Вы знаете в хоть один язык кроме HTML который действует в "txt"?
Ответить
Посмотри исходный код подскажи что мне исправить?
Ответить
Всё понял елки палки, а я туплю сижу:)
Ответить
А кстате, в html можно делать картинки прозрачными? Мне для моего сайта нужно.
Ответить
Как удалить мое сообщение? Там нету внизу "Удалить" "Редактировать" и "Ответить". Я этот комментарий даже отправить не могу =((
Ответить
Как это нет? Возможно, Вы просто не были авторизованы, либо Ваш сеанс был завершён после 15-ти минут бездействия на сайте.
Ответить
В старых браузерах никак, а в новых с помощью свойства opacity: .img {opacity: 0.5;}
Ответить
Михаил Русаков, а если я наберу вот такой вот код, то тогда куда мне комментарий на сайт отправится? Если чесно я с одного сайта скопировал вот это <script type='text/javascript'> var JOSC_postCSS=1;</script></div> <div id='JOSC_formpos'> <form name='joomlacommentform' method='post' action='index.php'> <a name='CommentForm'></a> <input type='hidden' name='content_id' value='36' /><input type='hidden' name='component' value='' /><input type='hidden' name='joscsectionid' value='0' /> <table align='center' cellpadding='0' cellspacing='0' class='form'> <tr> <td colspan='2'><div class='sectiontableheader'> <div id='CommentFormTitle' align='center'>Оставить комментарий</div> </div></td> </tr> <tr class='sectiontableentry1'> <td><div class='item'>Имя:</div></td> <td><div class='item'> <input name='tname' type='text' class='inputbox' size='40' value='' /> </div></td> </tr> <tr class='sectiontableentry1'> <td><div class='item'>Email:</div></td> <td><div class='item'> <input name='temail' type='text' class='inputbox' size='30' value='' /> </div></td> </tr> <tr class='sectiontableentry1'> <td><div class='item'>Тема:</div></td> <td><div class='item'> <input name='ttitle' type='text' class='inputbox' size='40'/> </div></td> </tr> <tr id='CommentToolbar' class='sectiontableentry2'> <td><div class='item'>UBB-Код:</div></td> <td><div class='buttoncontainer'> <div style='float: left;'> <a href='javascript:JOSC_insertUBBTag("b")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_bold.gif' class='buttonBB' name='bb' alt='[b]' /></a> <a href='javascript:JOSC_insertUBBTag("i")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_italicize.gif' class='buttonBB' name='bi' alt='[i]' /></a> <a href='javascript:JOSC_insertUBBTag("u")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_underline.gif' class='buttonBB' name='bu' alt='[u]' /></a> <a href='javascript:JOSC_insertUBBTag("url")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_url.gif' class='buttonBB' name='burl' alt='[url]' /></a> <a href='javascript:JOSC_insertUBBTag("quote")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_quote.gif' class='buttonBB' name='bquote' alt='[quote]' /></a> <a href='javascript:JOSC_insertUBBTag("code")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_code.gif' class='buttonBB' name='bcode' alt='[code]' /></a> <a href='javascript:JOSC_insertUBBTag("img")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/images/ubb_image.gif' class='buttonBB' name='bimg' alt='[img]' /></a> </div> <div style='float: left;'> <select name='menuColor' class='select' onchange='JOSC_fontColor()'><option>-цвет-</option><option>aqua</option><option>black</option><option>blue</option><option>fuchsia</option><option>gray</option><option>green</option><option>lime</option><option>maroon</option><option>navy</option><option>olive</option><option>purple</option><option>red</option><option>silver</option><option>teal</option><option>white</option><option>yellow</option></select> <select name='menuSize' class='select' onchange='JOSC_fontSize()'><option>-размер-</option><option>крошечный</option><option>маленький</option><option>средний</option><option>большой</option><option>огромный</option></select> </div> </div></td> </tr> <tr class='sectiontableentry1'> <td> </td> <td valign='middle'><div><div class='emoticoncontainer'><div class='emoticonseparator'></div><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":angry:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/angry.png' border='0' alt=':angry:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":0")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/blink.png' border='0' alt=':0' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":confused:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/blush.png' border='0' alt=':confused:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":cheer:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/cheerful.png' border='0' alt=':cheer:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon("B)")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/cool.png' border='0' alt='B)' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":evil:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/devil.png' border='0' alt=':evil:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":silly:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/silly.png' border='0' alt=':silly:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":dry:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/ermm.png' border='0' alt=':dry:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":lol:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/grin.png' border='0' alt=':lol:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":kiss:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/kissing.png' border='0' alt=':kiss:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":D")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/laughing.png' border='0' alt=':D' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":pinch:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/pinch.png' border='0' alt=':pinch:' /></a></span></span><div class='emoticonseparator'></div><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":(")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/sad.png' border='0' alt=':(' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":shock:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/shocked.png' border='0' alt=':shock:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":X")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/sick.png' border='0' alt=':X' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":side:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/sideways.png' border='0' alt=':side:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":)")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/smile.png' border='0' alt=':)' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":P")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/tongue.png' border='0' alt=':P' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":unsure:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/unsure.png' border='0' alt=':unsure:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":woohoo:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/w00t.png' border='0' alt=':woohoo:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":huh:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/wassat.png' border='0' alt=':huh:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":whistle:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/whistling.png' border='0' alt=':whistle:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(";)")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/wink.png' border='0' alt=';)' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":s")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/dizzy.png' border='0' alt=':s' /></a></span></span><div class='emoticonseparator'></div><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":!:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/icon_exclaim.gif' border='0' alt=':!:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":?:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/icon_question.gif' border='0' alt=':?:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":idea:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/icon_idea.gif' border='0' alt=':idea:' /></a></span></span><span class='emoticonseparator'><span class='emoticon'><a href='javascript:JOSC_emoticon(":arrow:")'><img src='http://softvt.jet-host.ru/components/com_comment/joscomment/emoticons/funny/images/icon_arrow.gif' border='0' alt=':arrow:' /></a></span></span></div></div></td> </tr> <tr class='sectiontableentry1'> <td> </td> <td><div class='item'> <textarea name='tcomment' class='inputbox' cols='40' rows='10'></textarea> </div></td> </tr> <tr> <td class='sectiontableentry2'> <table class='buttoncontainer' cellpadding='0' cellspacing='0'> <tr> <td><input type='button' class='button' name='bsend' value='Отправить' onclick='JOSC_editPost(-1,-1)' /></td> <td id='JOSC_busy'></td> </tr> </table> </td> <td class='sectiontableentry2'> </td> </tr> </table> </form> </div>
Ответить
Зависит от того, что написано в index.php (<form action = "index.php"), который если это не Ваш сайт Вы никак посмотреть не сможете.
Ответить
А куда надо ставить <form action =index.php>? И Internet Explorer Opera или Mozila Firefox не старые браузеры?
Ответить
Это никуда вставлять не надо. Эту строку я взял из кода, который Вы скопировали. IE, Opera и Firefox имеют много версий. Среди этих версий есть как самые свежие, так и очень старые.
Ответить
A Opera 9.25 старая или новая?
Ответить
Достаточно старая, но opacity поддерживает.
Ответить
Что делает тег <style type="text/css" media="all">? И можете сказать, как зделать меню, чтобы если зашел в него, то например на какой-нить http://goodprograms.info/brauzery/25-skachat-besplatno-internet-explorer-bez-registracii-i-sms.html ну в какой-нибудь документ внутри своего же сайта, например было www.mail.ru а куда-то зашел стало http://e.mail.ru/cgi-bin/login
Ответить
Тег <style type='text/css' media='all'> означает начало CSS-стиля. То есть далее идёт CSS. Чтобы реализовать второе, необходимо добавить ссылки, например, так: <a href='http://e.mail.ru'>e.mail.ru</a>, если, конечно, я правильно понял вопрос.
Ответить
И что делает тег <script type="text/javascript" src="/engine/classes/js/jquery.js"></script>?
Ответить
Данный тег подключает библиотеку jquery.js. Таким образом, подключается набор JS-функций, которые Вы далее можете использовать.
Ответить
Получился такой код <head> </head> <body> <p> <span>Текст</span> <p><br> <span>Текст</span><br></p>&имя_символа; </p> </body> </html> </html> Правильно или нет я написал?
Ответить
В общем-то правильно, но тут надо понимать, что Вы хотели вообще получить. И ещё неясно, что за &имя_символа;
Ответить
Михаил, подскажите где можно найти список кодов спецсимволов
Ответить
Первые две выдачи Яши по запросу Таблица кодов спецсимволов)
Ответить
Спасибо, нашёл!!! Всё-таки мощный Зверь этот Яндекс
Ответить
Как установить соц кнопки
Ответить
Соцкнопки сервисом я ставлю обычно. share.pluso.ru
Ответить
Всем доброго времени суток ! У меня может быть глупый вопрос но всё же... Как спецсимволы можно отображать 2 способами например пробел можно отобразить как и  . Вопрос какой код будет более корректным
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.