До
сих пор мы с Вами выравнивали элементы только по левому краю. Точнее,
мы с Вами вообще этим не занимались, а сам браузер по умолчанию
выравнивает элементы по левому краю. Разумеется, было бы слишком скучно
выравнивать всё по левому краю. Поэтому существуют различные способы
выравнивания по центру и по правому краю. Выравнивание элементов - это самые основы HTML, которые просто необходимо знать при создании интернет сайтов. Первое, что необходимо сделать - это набрать HTML-код простейшей страницы. Ещё когда-то давно появился тег <center>
я сейчас Вам не советую его применять, ввиду наличия более современных
способов, но не упомянуть я о нём не могу. Использовать его очень и
очень просто. Всё, что Вам необходимо выравнять по центру, Вы помещаете
внутри этого тега. Вот, например, тут мы выравниваем заголовок 1-го
уровня по центру. 
<center>
<h1>Заголовок 1-го уровня, выравненный по центру</h1>
</center>Можно добавить картинку, выравненную также по центру, также давайте перейдём на следующую строку с помощью тега <br>: <center>
<h1>Заголовок 1-го уровня, выравненный по центру</h1>
<br>
<img src = "Водяные лилии.jpg" width = "150" height = "150">
</center>Это был тег <center>, который уже устарел, вдобавок, вопреки Вашим ожиданиям тегов <left> и <right> просто не существует. Допустим, по левому краю выравнивается по умолчанию, по центру выравнивается с помощью тега <center>, но как же быть с правым? Чтобы решить эту проблему разработчики придумали универсальный способ выравнивания элементов HTML. Способ заключается в использовании так называемых контейнеров, которые создаются с помощью тега <div>. То есть всё, что необходимо поместить в определённый контейнер помещается внутри тега <div>. А уже у этого тега есть атрибут "align", значение которого и определяет положение данного контейнера. Бывают три значения: "left", "center", "right". По умолчанию, стоит "left", впрочем, думаю, что Вас это не удивляет. Давайте сейчас напишем тот же HTML-код, но с использованием контейнеров, вдобавок, давайте выравняем не по центру, а по правому краю. <div align = "right">
<h1>Заголовок 1-го уровня, выравненный по правому краю</h1>
<br>
<img src = "Водяные лилии.jpg" width = "150" height = "150">
</div>Как видите, всё работает. Советую Вам также поменять значения атрибута "align", чтобы посмотреть на другие виды выравнивания содержимого контейнеров. Другой способ выравнивания элементов HTML - это таблицы, но эта тема заслуживает отдельного разговора, поэтому поговорим о ней в одной из следующих статей. А пока Ваша страница должна выглядеть так: <html>
<head>
</head>
<body>
<center>
<h1>Заголовок 1-го уровня, выравненный по центру</h1>
<br>
<img src = "Водяные лилии.jpg" width = "150" height = "150">
</center>
<div align = "right">
<h1>Заголовок 1-го уровня, выравненный по правому краю</h1>
<br>
<img src = "Водяные лилии.jpg" width = "150" height = "150">
</div>
</body>
</html>
Источник: http://rahman. html | 
Каталог статей 