2 less
This presentation is the property of its rightful owner.
Sponsored Links
1 / 23

2 less PowerPoint PPT Presentation


reu it second lesson itc

Download Presentation

2 less

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


2 less

Разметка текста


2 less

Абзацы. Тег <p>

<p>Это абзац, тут текст</p>


2 less

Заголовки

<h1>Heading 1</h1>

<h2>Heading 2</h2>

<h3>Heading 3</h3>

<h4>Heading 4</h4>

<h5>Heading 5</h5>

<h6>Heading 6</h6>


2 less

Списки. Неупорядоченные

Пример кода

<ul> <li>Пункт 1</li>

<li>Пункт 2</li>

<li>Пункт 3</li></ul>

Результат

  • Пункт 1

  • Пункт 2

  • Пункт 3


2 less

Списки. Упорядоченные

Пример кода

<ol start=’3’> <li>Пункт 1</li>

<li>Пункт 2</li>

<li>Пункт 3</li></ol>

Результат

3. Пункт 1

4. Пункт 2

5. Пункт 3


2 less

Многоуровневые списки

<ul> <li>1 <ul> <li>1.1</li> <li>1.2</li> </ul> </li> <li>2</li></ul>


2 less

Многоуровневые списки

Пример кода с ошибкой:

<ul> <li>1</li> <ul> <li>1.1</li> <li>1.2</li> </ul> <li>2</li></ul>


Strong b em i

Strong и b, Em и i

Этот тег определяет <strong>важность</strong> отмеченного текста

Этот тег определяет <b>важность</b> отмеченного текста

Результат

Этот тег определяет важность отмеченного текста

Инструктор Кекс любит <em>играть</em> с укропом

Инструктор Кекс любит <i>играть</i> с укропом

Результат

Кекс не любит питаться укропом


Br hr

Теги br и hr

<p>тут много текста</p>

<br>

<p>тут еще больше текста, а после будет линия</p>

<hr>


2 less

Цитаты

  • <blockquote> предназначен для выделения длинных цитат, которые могут состоять из нескольких абзацев. Тег выделяет цитату как отдельный блок текста с отступами.

  • <q> предназначен для выделения коротких цитат в предложениях. Текст внутри этого тега автоматически обрамляется кавычками.

  • <cite> используется для того, чтобы выделить источник цитаты, название произведения или автора цитаты.


2 less

Верхние и нижние индексы

Тег <sup> отображает текст в виде верхнего индекса.

mc<sup>2</sup>

Тег <sub> отображает текст в виде нижнего индекса.

H<sub>2</sub>O


2 less

Преформатированный текст

<pre>Если вы есть — будьте первыми,

Первыми, кем бы вы ни были.

Из песен — лучшими песнями,

Из книг — настоящими книгами. </pre>


2 less

Ссылки


2 less

Тег a

<a href="http://web.the-center.it">ITc</a>


Https the center it courses

https:// — это протоколthe-center.it — имя сервера, также называется домен или хост/courses — путь

Абсолютные адреса


2 less

Относительные адреса

Примеры относительных адресов

courses/1./courses../../run/1


2 less

Ссылка с якорем

<a href="#glava1">Глава 1</a>

...

<h2 href="glava1">Глава 1</h2>


2 less

Всплывающая подсказка

<a title="Подсказка" href="#">


2 less

Изображение


2 less

Тег img

<img src="logo.png">

Изображение ссылка

<a href="vk.com"><img src="logo.png"></a>


2 less

htmlbook.ru - справочник по HTML/CSS

www.w3.org - организация, разрабатывающая и внедряющая технологические стандарты для Всемирной паутины

codepen.io - онлайн редактор кода, с возможностью делится своими исходниками

Полезные ссылки


  • Login