Scroll
HTML primeiros passos - Aula 2: tags p, div e suas diferenças. Tag br
В прошлом уроке мы создали свой первый html документ, а это значит что вы уже знаете, что пишем html-код в текстовом редакторе, а все изменения смотрим через браузере, обновляя страницу (обычно кнопкой F5).
Nesta aula continuaremos com texto usando as tags span, p e div; veremos também a tag br.
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
</body>
</html>Это наш код с которым мы будем дальше работать.
Давайте добавим такие вот строки.
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<p>Первая строка в теге P</p>
<p>Вторая строка в теге P</p>
<div>Первая строка в теге DIV</div>
<div>Вторая строка в теге DIV</div>
</body>
</html>Abrindo no navegador, você verá que as tags p exibem frases em linhas separadas, mas há diferenças. O navegador deu ao P margem padrão acima/abaixo, enquanto no div as linhas ficam coladas. Isso porque p é a tag de parágrafo, e div é a tag de bloco/área. Para texto use P; para destacar uma área (fundo, bordas) use DIV.
Texto DEVE estar em p ou h1-h6, exceto se for texto de apoio à diagramação. Assim o texto deve ficar:
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<div>
<p>Первая строка в теге P</p>
<p>Вторая строка в теге P</p>
</div>
</body>
</html>A sequência fica: body>div>p. Lembre-se, nunca coloque div dentro de p, body>p>div está errado.
Vejamos como quebrar linha. Se o parágrafo é enorme, dá para dividi-lo em vários parágrafos ou usar a tag de quebra br. A tag <br /> é única, por isso a barra vem antes do sinal de maior.
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<div>
<p>Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1989—1991 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов. Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE>, несколько раз использованный для форматирования страницы, которую вы на даный момент читаете, предназначен для создания в документах самых обычных таблиц, но, как можно убедиться, здесь нет ни одной таблицы. С течением времени, основная идея платформонезависимости языка HTML была отдана в своеобразную жертву современным потребностям в мультимедийном и графическом оформлении.</p>
</div>
</body>
</html>A linha ficou longa demais; quebrá-la no editor não muda nada no HTML:
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<div>
<p>Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1989—1991 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария).
HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов.
Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения).
В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE>, несколько раз использованный для форматирования страницы, которую вы на даный момент читаете, предназначен для создания в документах самых обычных таблиц, но, как можно убедиться, здесь нет ни одной таблицы.
С течением времени, основная идея платформонезависимости языка HTML была отдана в своеобразную жертву современным потребностям в мультимедийном и графическом оформлении.</p>
</div>
</body>
</html>No navegador nada muda; aqui entra a tag <br />, colocada ao fim de cada linha.
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<div>
<p>Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1989—1991 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария).<br />
HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки.<br />
HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов.<br />
Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ.<br />
Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста.<br />
Мультимедийные возможности были добавлены позже.<br />
Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения).<br />
В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов).<br />
Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег, несколько раз использованный для форматирования страницы, которую вы на даный момент читаете, предназначен для создания в документах самых обычных таблиц, но, как можно убедиться, здесь нет ни одной таблицы.<br />
С течением времени, основная идея платформонезависимости языка HTML была отдана в своеобразную жертву современным потребностям в мультимедийном и графическом оформлении.</p>
</div>
</body>
</html>Agora o navegador entende que deve quebrar linha: é o que a tag <br /> informa.
Também podemos dividir o texto em parágrafos com as tags p.
<html>
<head>
<title>Мой первый HTML-документ</title>
</head>
<body>
<h1>Мой первый HTML-документ</h1>
<div>
<p>Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1989—1991 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария).<br />
HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки.<br />
HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов.<br />
Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ.<br />
Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста.<br />
Мультимедийные возможности были добавлены позже.<br />
</p>
<p>
Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения).<br />
В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов).<br />
Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег, несколько раз использованный для форматирования страницы, которую вы на даный момент читаете, предназначен для создания в документах самых обычных таблиц, но, как можно убедиться, здесь нет ни одной таблицы.<br />
С течением времени, основная идея платформонезависимости языка HTML была отдана в своеобразную жертву современным потребностям в мультимедийном и графическом оформлении.</p>
</div>
</body>
</html>Atualize a página: o texto aparecerá dividido em dois parágrafos.