X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Помогите немогу понять в чем дело разметка текста
kosyan_hb
kosyan_hb
Topic Starter сообщение 20.7.2011, 6:05; Ответить: kosyan_hb
Сообщение #1


Вот это у меня index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Одноколоночный шаблон</title>
<meta name="keywords" CONTENT="">
<meta name="description" content="Шаблон одноколоночного сайта">
<link rel="stylesheet" type="text/css" href="style/style.css"/>
</head>
<body>
<!-- Начало блока контейнера -->
<div id="container">
<!-- Начало блока шапки -->
<div id="header">
<img class="log" src="путь" alt="Логотип" title="Логотип"> <!-- Логотип -->
<h1>Название сайта</h1> <!-- Заголовок сайта -->
<div class=menu><a href="Путь">Ссылка 1</a> | <a href="Путь">Ссылка 2</a> | <a href="Путь">Ссылка 3</a> | <a href="Путь">Ссылка 4</a> | <a href="Путь">Ссылка 5</a></div> <!-- Блок меню -->
</div>
<!-- Конец блока шапки -->
<!-- Начало блока контента -->
<div id="content">
<h2>Шаблон одноколоночного сайта</h2> <!-- Заголовки -->
<h2>Технология создания сайта.</h2>
<p class="st">Буквица придает тексту определенный стиль.</p> <!-- Стиль Буквицы -->
1.Выбрать тему.
2.На сайте wordstat.yandex.ru проверить, что ищут в сети по выбранной теме.
3.Определить ключевые слова, по которым запросов более 1000 в месяц.
4.Составить список ключевых слов.
5.Посмотреть другие сайты по схожей тематике.
6.Определиться с главной страницей (количество колонок).
7.Составить план сайта.
8.Разработать логотип сайта.
9.Придумать оригинальное, легко запоминающееся название сайту.
10.Разработать меню навигации по сайту.
11.Составить карту ссылок сайта.
12.Сделать файл robots.txt
13.Сделать иконку сайту (favicon).
14.Наполнить сайт контентом, используя ключевые слова.
15.Придумать доменное имя сайту.
16.Разместить сайт на хостинге.
</div>
<!-- Конец блока контента -->
<!-- Начало блока подвала -->
<div id="footer">Минск 2011 г.</div>
<!-- Конец блока подвала -->
</div>
<!-- Конец блока контейнера -->
</body>
</html>




а это css
body {
font: 0.8em Arial, Helvetica, sans-serif; /* Шрифт на веб-странице */
background: url(image/bg_01400.jpg) #eee; /* Путь к фоновой картинке и цвет фона,
если пользователь отключил показ картинок*/
color: #000; /* Цвет текста */
}

a:link { /* Цвет ссылки */
color: #00F; text-decoration:none; font-family: Arial, Verdana;
}
a:visited { /* Цвет посещенной ссылки */
color: #00008B; text-decoration:none; font-family: Verdana, Arial;
}
a:active { /* Цвет активной ссылки */
color: #f00; text-decoration:none; font-family: Verdana, Arial;
}
a:hover { /* Цвет ссылки при наведении курсора*/
color: #f00; text-decoration:underline; font-family: Verdana, Arial;
}

#container {
width: 1024px;
margin: 0 auto; /* Выравнивание контейнера по центру */
background: #ffffff; /* Цвет фона всего макета */
}

Создадим блок шапки
#header { /* Шапка */
margin: 0; /* Отступ шапки */
padding: 3px; /* Отступы вокруг элементов */
}

Теперь создадим идентификатор для контента сайта.
#content { /* Контент */
width:900px;
background: #ffffff; /* Цвет фона колонки */
margin: 0 auto; /* Отступ колонки */
padding: 15px; /* Отступы вокруг текста */
text-align: justify; /* Выравнивание по ширине */
}

Создадим стили для подвала.
#footer { /* Подвал */
clear: both; /* Отменяем действие float */
padding: 5px; /* Отступы вокруг текста */
background: #F5FFFA; /* Цвет фона подвала */
text-align: center; /* Выравнивание по центру */
}

Добавим стили для шрифтов.
h1 { /* Стили для шрифта h1 */
font-size: 40pt; /* Размер шрифта заголовка */
text-align: center; /* Выравнивание */
color: green; /* Цвет шрифта заголовка */
margin: 0 0 0 280px; /* Отступ заголовка */
padding: 7px; /* Отступы вокруг текста */
background: #F5FFFA; /* Фон заголовка */
}
h2 { /* Стили для шрифта h2 */
text-align: center; /* Выравнивание */
color: red; /* Цвет шрифта заголовка */
margin: 0; /* Отступы вокруг заголовка */
}

Создадим стили для горизонтального меню.
.menu { /* Стили для меню */
text-align: center; /* Выравнивание */
padding: 7px; /* Отступы вокруг заголовка */
background: #F5FFBA; /* Фон меню */
margin: 0 0 0 280px; /* Отступы меню */
}

Добавим стиль для Буквицы.
.st:first-letter { /* Стили для Буквицы */
font-family: Arial, serif; /* Шрифт */
color: red; /* Цвет шрифта */
font-size: 150%; /* Размер шрифта */
}

Создадим стили для логотипа.
.log { /* Аттрибуты картинки Логотип */
margin: 2px; /* Отступы картинки */
text-align: left; /* Выравнивание по левому краю */
width: 275px; /* Ширина картинки */
height: 100px; /* Высота картинки */
float: left; /* Обтекание текста справа */
}


p {
text-indent:20pt; /* Отступ первой строки абзаца */
text-align: justify; /* Выравнивание по ширине */

.p1 { /* Класс абзаца */
text-align: left; /* Выравнивание влево */
color: black; /* Цвет шрифта */
padding: 3px; /* Отступ текста */
}




проблема в том
Нужно чтобы текст выравнивался
по ширине но при этом были отступы
от края . Так чтобы белый блок
не уменьшался.
[attachment=38032:helpme.jpg]
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
zidan
zidan
сообщение 20.7.2011, 12:14; Ответить: zidan
Сообщение #2


Во-первых, нужно обернуть этот текст в какой-нибудь контейнер. Здесь, конечно, список напрашивается, но для обобщения будем считать, что это абзац:
<p>
1.Выбрать тему.<br>
2.На сайте wordstat.yandex.ru проверить, что ищут в сети по выбранной теме.<br>
3.Определить ключевые слова, по которым запросов более 1000 в месяц.<br>
...
</p>

Во-вторых, нужно в CSS добавить отступы для этого контейнера (или для класса, который будет ему присвоен):
[CSS]p
{
text-indent: 20pt; /* Отступ первой строки абзаца */
text-align: justify; /* Выравнивание по ширине */
padding: 0 40px; /* Отступ от левого и правого края */
}[/CSS]
P.S. Код нужно оформлять нормально. А то отвечать никто не будет)

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Помогите вспомнить рекламного бота Телеграм для обмена рекламой
0 Mixatraider 692 21.2.2024, 23:42
автор: Mixatraider
Открытая тема (нет новых ответов) Перевод текста в речь нейросетями - сервис Zvukogram
13 Zvukogram 7138 19.2.2024, 18:16
автор: freon_mr777
Открытая тема (нет новых ответов) 📌 Рандомизация видео/аудио/фото/текста с минимальным участием - 𝓓𝓮𝓵𝓽𝓪𝓣𝓸𝓸𝓵𝓼
Мы предлагаем комплексное решение для рандомизации всех видов офера
2 leviathan 1340 29.1.2024, 21:29
автор: leviathan
Открытая тема (нет новых ответов) Нужен перевод текста с RU на UZ
0 REGNET 743 22.2.2023, 15:17
автор: REGNET
Открытая тема (нет новых ответов) Наполнение сайта Автотематики (написание текста с размещением)
Ищу человека для длительного сотрудничества
2 NYLesha 1808 1.8.2022, 23:22
автор: NYLesha


 



RSS Текстовая версия Сейчас: 29.3.2024, 5:31
Дизайн