logo

Коды HTML

Коды, которые Вам пригодятся.

Коды, которые описаны ниже, пригодятся для создания страниц сайта. В своё время пришлось покопаться в интернете для их поиска. Это сократит немного Вам времени.
Абзац
При написании текста, чтобы он выглядел красиво, необходимо каждый абзац начинать с красной строки. Это можно сделать двумя способами. Можно в визуальном редакторе сделать это кнопкой "пробел", но в этом случае в общий код страницы попадает много не нужных знаков, которые считаются мусором. Сделать лучше специальным кодом, который выглядит так:

<p style="text-indent: 25px;">текст</p>

Вставляете это код в начале каждого абзаца. 25 - это расстояние от края в пикселях, которое можно менять. И не забывайте закрывать абзац тегом </p>.

Код активной ссылки

Теперь рассмотрим код активной ссылки. Такая ссылка нужна для перенаправления посетителя на какую-то страницу сайта, или на другой сайт, и т.д. Ссылка выглядит так:

<a href="http://адрес направления"> название ссылки </a>

"http:// - здесь вставляете адрес нужной страницы, или адрес сайта. Название ссылки - тут можно вставить нужное слово - перейти, посмотреть, ознакомиться, и т.д., в общем слово, которое Вам подходит.

Чтобы активная ссылка открывалась в другом окне, при это Ваш сайт будет открыт, то в этот код необходимо добавить
target="_blank" , тогда код активной ссылки будет выглядеть следующим образом:

<a href="http://адрес направления"target="_blank"> название ссылки </a>

Вместо "название ссылки" можно вставить какую-нибудь картинку, т.е. вписываете адрес картинки, взятый из файлового менеджера.

Текст в рамке

Иногда возникает необходимость заключить какой-то текст в рамочку. Рассмотрим несколько вариантов. Если необходимо просто поместить текст в рамку, то надо воспользоваться следующими тегами:

<fieldset>необходимый текст</fieldset>

Можно заключить в рамку текст с заголовком

<fieldset><legend><b>Заголовок</b></legend>здесь текст</fieldset>

Пример можете посмотреть ЗДЕСЬ. Вместо названия можно вставить картинку для текста:

<fieldset><legend><img src="здесь вставить адрес картинки"></legend>Здесь текст</fieldset>

Обтекание блока рекламы текстом

При установке на страницы сайта небольших блоков рекламы, остаётся пустое пространство. Чтобы заполнить его текстом, который будет обтекать блок рекламы, можно воспользоваться следующим кодом:

<div style="display:block;float:left;margin:5px 5px 5px 5px;">сюда вставляете код рекламного блока</div>

В коде цифрами можно регулировать расстояние между блоком и текстом. left можно сменить на right, это регулирует место установки рекламного блока, справа или слева. Так же можно вставлять вместо рекламного блока любую картинку. Эта картинка будет обтекаться текстом. Проверено!

Как сделать код HTML видимым на странице сайта


Иногда при создании страницы, возникает необходимость выложить на странице какой-то скрипт для того, чтобы посетители могли его скопировать. Чтобы этот скрипт был виден на странице и не занимал много места, можно воспользоваться такими тегами:

<textarea>место для кода скрипта </textarea>

В результате получится рамочка, в которой будет расположен скрипт, или какая-то другая информация. Эта рамка изменяет свой размер с помощью мышки. Для примера размещу скрипт календаря с моего сайта.

Кнопка "Вернуться"

Иногда возникает необходимость вернуться с одной страницы на ту с которой попали на эту страницу. Есть несколько вариантов для этого. Можно поставить код активной ссылки, а можно установить внизу по средине страницы кнопочку "Вернуться". Ниже код такой кнопки:
<div align="center"><input onclick="window.history.back();" type="button" value="Вернуться"/></div>
Как правильно прописать rel=nofollow и <noindex>

  1. Для закрытия ссылок от индексации, с помощью rel=”nofollow”,  используется простая схема:
    <a rel=”nofollow” href=”http://www.site.com” title=”Подсказка”>Ссылка на сайт</a>
    перехода по ссылке не будет.
  2. Для закрытия блока текста тегом <noindex>, со всем содержимым, в том числе и с анкорами ссылок, используется схема:
    <!--noindex-->Блок вашего закрываемого текста<!--/noindex-->
    данный текстовый блок не будет проиндексирован в Яндекс, со всеми текстами ссылок.
  3. Для закрытия блока текста тегом и ссылок в блоке, используется схема:
    <!--noindex-->Блок вашего закрываемого текста <a rel="nofollow" href="http://www.site.com" title="Подсказка">Текст анкор ссылки</a> Блок вашего закрываемого текста<!--/noindex-->
    данный блок не будет проиндексирован в Яндекс, со всеми ссылками содержащимся в данном блоке.

Текст в рамке
Если вдруг возникнет необходимость выделения какой-то строчки или куска теста рамочкой, то можно воспользоваться таким кодом:
<span style="border-width:thin; border-style:dotted; border-color:#FF5730">Выделяемый текст</span>
Пример рамки в виде точек:

Выделим эту строчку рамкой.

Этот код делает рамку штрих-пунктирной линией:
<span style="border-width:thin; border-style:dashed; border-color:#FF5730">Выделяемый текст</span>
Пример рамки в виде штрих-пунктира:

Выделим эту строчку рамкой

Теперь сделаем обводку жирной линией:
<span style="border-width:thick; border-style:groove; border-color:#FF5730">Выделяемый текст </span>

Выделим эту строчку рамкой

 

Коды HTML обновлено: Июль 5, 2017 автором: admin

2 комментария к “Коды HTML”

  1. admin:

    Добрый день! Не видя сайта, трудно гадать. Давайте адрес сайта и будем смотреть….

  2. Добрый день. Подскажите пожалуйста, как сделать так, чтобы виджет не наслаивался на нижнюю часть сайта?

Оставить комментарий

▲Вверх