Варна - 2006

Съдържание:

HTML - Въведение
HEAD
BODY - фон, текст, цветове на връзките
FONT - работа с текстове
Форматиране на параграфи
Цветове
Хипервръзки
IMG - Изображения
Таблици
Списъци
Формуляри
Линии
Фреймове
Музикален фон

Форматиране на параграфи

Положението на текста в една HTML-страница трябва изрично да се укаже. Ако отворите един текстов редактор и започнете да пишете в него само текст, без никакви команди за указване на разположението на текста по страницата, текста ви ще се появи в прозореца на браузъра подравнен по най-горната и най-лявата му част и без никакви интервали между отделните редове, независимо дали при писането в текстовия редактор сте оставили такива или не.

Разполагането на текста по страницата става чрез следните тагове:

Параграфи

  • Тага за параграф е <p>. Той има и завършващ таг - </p>
  • Текстовия блок затворен между таговете <p> и </p> ще се появи на страницата на един ред разстояние от предходния и следващия го текст, както е разположен настоящия текстов блок.
  • За подравняване на текст вляво, вдясно и центриране на текст се добавя атрибут align към тага <p>.
  • Друг таг за оформяне на текста в отделни параграфи е <div> ......... </div>, който също може да има атрибута align.
  • Ако изпишете няколко тага за параграф един след друг това ще има същия ефект както от един таг.

 

Преминаване на следващ ред

  • Тага за преминаване на следващ ред е <br /> и той няма затварящ таг.
  • Но тъй като XHTML изисква затваряне на всички тагове, в тага за преминаване на следващ ред се поставя наклонена завършваща черта на един интервал разстояние от буквите br - както е показано в примера.
  • На страницата ви ще се появят толкова свободни редове, колкото пъти изпишете тага <br /> Ако напишете например <br /> <br /> <br /> <br /> <br /> <br /> това ще предизвика следния ефект:



Отстъп на блоков текст

  • Ако искате един блоков текст (например дълъг цитат) да се открои от останалия текст трябва да използвате тага <blockquote> Той има затварящ таг </blockquote>
  • Текста заключен между тези два тага ще се появи като абзац с отстъп и със свободен ред над и под него.
  • Ако в една двойка тагове се вмъкне и втора ще се получи още по-голям отстъп.

Оставяне на по-голям интервал между думите

Колкото и пъти да натискате клавиша за интервал на клавиатурата, това няма да даде отражение в html-документа. За да оставите по-голям интервал, трябва да въведети кода &nbsp; (В Dreamweaver трябва да преминете в режим Code и да въведете този код колкото пъти е необходимо.)

 

Атрибути на тага <P> и <DIV>

  • align="left"
  • align="right"
  • align="center"
  • align="justify"
  • За да центрирате текст може да ползвате и тага <center> , който има завършващ таг </center> Но е препоръчително все пак да се ползва тага div, тъй като тага center не се възприема от браузърите във всички случаи.

 

Упражнение 6:

а) Копирайте следния текст в лявата част на прозореца по-долу и натиснете бутона над него.

<html>
<body>

<p>
Този параграф
съдържа 5 реда
в сорс кода,
но браузърът
игнорира това.
</p>

<blockquote>

Това е отместен текст

</blockquote>


<p>
Броя на редовете в параграфа зависи от големината на прозореца.Ако променяте размера на прозореца, ще се променят и броя редове.
</p>

 

</body>
</htm>

б) Добавете атрибути на таговете <p> в горния пример.

в) Пробвайте различни варианти за форматиране на произволен текст.

Упражнение 7:

Създаване на web-страница с Macromedia Dreamweaver - текстове

  1. Отново се използва панела Properties както в предния урок.
  2. Текста трябва да е предварително маркиран и от бутоните за подравняване да се избере съответния вариант подобно на бутоните за подравняване на абзаци в Word.
  3. Blockquote се получава като се посоче бутончето в средата на втори ред със стрелка надясно, а обратно се връща със стрелка наляво.
JDJ © 2006 Всички права запазени.