Вопрос, думаю, простенький: как в начале предложения поставить отступ ("Красную строку")?
Какой тег дя этого нужен?

Можешь попробовать <blockquote></blockquote>

или перед текстом добавить &nbsp; пару раз-)

В CSS свойство есть text-indent, наиболее часто используют значение 2em.

Хе , спасибо, сейчас попробую.

Цитата(Mal @ 8.4.2005, 13:31)

В CSS свойство есть text-indent, наиболее часто используют значение 2em.

Да, это самое правильное. Только это работает для блочных элементов.

Код

<style> p {text-indent: 2em} </style>

То есть каждый абзац надо заключать в <p>...</p>.

Сделать это автоматически можно при помощи этой утилитки:
http://www.artlebedev.ru/tools/typograf/
(зайди в настройки, разберёшься). Только там каждый абзац должен быть отделён пустой строкой, чтобы он в <p></p> облачился. Иначе просто <br> ставится - а с ним text-indent работать не будет.

Так что самый рулезный вариант - вставляешь пустые строки между абзацами, настраиваешь Типограф, преобразуешь им текст. Он там ещё кое-какие хорошие преобразования с текстом сделает - можешь почитать тут:
http://www.artlebedev.ru/kovodstvo2/sections/62/

Ещё.

Настроить расстояние между абзацами (между <p></p>) можно так:

Код

<style> p { margin-top: 0px; margin-bottom: 0px; } </style>

Здесь margin-top и margin-bottom - отступы сверху и снизу для каждого абзаца.

Это сообщение отредактировал(а) dm9 - 9.4.2005, 17:02

dm9 О как все круто! И все только для отступов в абзацах Но, зато потом больше ничего править не надо, т.к. все автоматически будет настраиваться. Вот только разобраться с этим осталось (самая малость )

Код

<style> p {text-indent: 2em} </style>

- вот это в начало кода надо вставлять, где стили описываются?

p {text-indent: 2em} - это вставлять туда, где описываются стили

Вообще, они описываются либо в подключаемом .css файле, либо между <head></head> вставляешь

Код

<style type="text/css"> /* Так обозначаются комментарии в CSS */ /* Тут твои стили. Например: */ p {     text-indent: 2em;     margin-top: 0px;         margin-bottom: 0px; } </style>

Это сообщение отредактировал(а) dm9 - 11.4.2005, 12:41

Вообще-то это в 99% случаев делается так:

Код

.class:first-line {    margin-left: 20px; }

Правда?

А под какой это браузер?

dm9 Привет! Твой вариант мне кажется самым верным, а он по все браузеры подходит (ну хотя бы в Мозилле прокатит)?

Ну... ваабче-та я стараюсь давать примеры, которые работают как минимум под наиболее популярные виндовые браузеры

Под Firefox 1.0.2 работает, однако работать будет и на более ранних версиях... Под Оперу работает, начиная с версии 6.0 точно. Вообще, это всё в спецификации пропиано, так что работать обязано везде. Может, на старых браузерах проглючит где, конечно...

dm9

Код

<span color="#FFFFF"> <p class="style9">Мы рады приветствовать Вас на нашем сайте...</p></span>  <span color="#FFFFF"> <p class="style9">Если Вам необходимо...&nbsp;</p></span>

Это код моего текста. Модно ли как-то сделать и последующие строки ("на нашем сайте") сделать с некоторым отступом, меньшим, чем отступ красной сроки?

Не понял вопроса. Объясни подробее.

PS Конструкия

Код

<span color="#FFFFF"> <p class="style9">Мы рады приветствовать Вас на нашем сайте...</p></span>

меня просто убила... включи этот цвет в style9. Тем более что цвета #FFFFF (состоит из пяти знаков) не бывает.

dm9
А я еще думаю, отчего же текст в Мозилле не белый? Спасибо!
А про остальное я вот про что: ширина строки текста ограничена => текст переносится на следующую строку (назовем ее строка 2). Хотелось бы, чтобы у строки 2 тоже был небольшой отступ (но меньший, чем отступ красной строки). Вот.

Это задаётся левым паддингом (можно margin-ом).
Смотри пример.
Также в этом примере я показываю, как можно воспользоваться дочерними стилями вместо того, чтобы для каждого <p> прописывать class="style9".

И ещё, почитай, пожалуйста, про паддинги, маржины, бордеры. Иногда спецификацию почитать полезно
http://loc.stack.ru/projects/CSS2/box.html#box-dimensions
Вот как-то видел картинку, на которой это всё очень просто показано, но что-то найти не могу. Но в приведённой ссылке тоже неплохо описано.

В двух словах:
Padding служит для задания отступа от границы элемента до контента это элемента.
Margin задаёт отступ самого элемента от границы родительского элемента или от соседних элементов.

Код

<style> div.qwe p {  /* Стиль для всех дочерних элементов p, родителем которых является div со стилем qwe */     text-indent: 2em;    /* Отступ красной строки */             margin-top: 0px;     /* Пустое место сверху от p */     margin-bottom: 10px; /* Пустое место снизу от p */     background: orange;  /* Цвет p, просто, чтобы было видно его границу */     padding-left: 20px;  /* Отступ текста в p от левой его границы */     padding-right: 20px; /* Отступ текста в p от правой его границы */ } </style> <div class="qwe"> <p>Header1<br />Line1<br />Line2</p> <p>Header2<br />Line1<br />Line2</p> <p>Header3<br />Line1<br />Line2</p> </div>

Это сообщение отредактировал(а) dm9 - 16.4.2005, 00:39

Цитата(dm9 @ 11.4.2005, 20:24)

А под какой это браузер?

Под все. Станлдартный псевдокласс. Читай на w3.org

Aliance, давай так.

Спецификацию я читал.

Также, если не путаю, margin имеет физический смысл только для блочных элементов. Первая же строка текста блоком никак не является.

Далее, пробуем на практике.

Код

<style> div.qwe p:first-line {     margin-left: 20px;     color: red; } </style> <div class="qwe"> <p>Header1<br />Line1<br />Line2</p> <p>Header2<br />Line1<br />Line2</p> <p>Header3<br />Line1<br />Line2</p> </div>

Не работает. Какой вывод делаем? Вывод такой. Этот метод не годится.
Или я как-то неправильно применяю :first-line? Расскажи, пожалуйста.

dm9
Вот мой код с вставленными твоими рекоммендациями:

Код

<STYLE>  BODY {   scrollbar-arrow-color:FFDEAD;   scrollbar-shadow-color:B5C2D5;   scrollbar-face-color:B5C2D5;   scrollbar-highlight-color:FFDEAD;   scrollbar-darkshadow-color:FFDEAD; .style1 {font-family: Geneva, Arial, Helvetica, sans-serif} .style3 {color: #260} .style5 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #663366; } .style7 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #663399; font-size: 20px; } .style9 {color: #FFFFFF} div.qwe p {  /* Стиль для всех дочерних элементов p, родителем которых является div со стилем qwe */     text-indent: 2em;    /* Отступ красной строки */             margin-top: 0px;     /* Пустое место сверху от p */     margin-bottom: 10px; /* Пустое место снизу от p */     background: orange;  /* Цвет p, просто, чтобы было видно его границу */     padding-left: 20px;  /* Отступ текста в p от левой его границы */     padding-right: 20px; /* Отступ текста в p от правой его границы */ } <div class="qwe"> <p>Header1<br />Line1<br />Line2</p> <p>Header2<br />Line1<br />Line2</p> <p>Header3<br />Line1<br />Line2</p> </div> </STYLE>

Похохе,я ничего не понимаю, т.к. ни цвета больше нет, ни отступов!

Ты забыла закрывающуюся фигурную скобку у BODY.

Добавлено @ 16:36
И ещё ты вставила тэги <div>...</div> внутри тэга style

А ещё цвета начинаются с #, просто FFDEAD работать не будет...

Во, я вот так сделала:

Код

<STYLE>  BODY {   scrollbar-arrow-color:FFDEAD;   scrollbar-shadow-color:B5C2D5;   scrollbar-face-color:B5C2D5;   scrollbar-highlight-color:FFDEAD;   scrollbar-darkshadow-color:FFDEAD; .style1 {font-family: Geneva, Arial, Helvetica, sans-serif} .style3 {color: #260} .style5 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #663366; } .style7 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #663399; font-size: 20px; } .style9 {color: #FFFFFF} </STYLE> <style type="text/css"> p {     text-indent: 2em;     margin-top: 0px;         margin-bottom: 0px;     padding-left: 20px;  /* Отступ текста в p от левой его границы */     padding-right: 20px; /* Отступ текста в p от правой его границы */ } } .style20 {color: #663399} </style>

Так работает.
style9 {color: #FFFFFF} решила вставлять перед конкретным <р>, т.к. не везде текст белым будет.

Добавлено @ 16:47

Код

margin-top: 0px;

Причем о-ой отступ сверху стоит, а текст все равно где-то по середине (по вертикали) получился. Aling=justify.

Теперь показываю, как сделать грамотно.

Находи отличия между моим и своим вариантом.

Код

<style type="text/css">     BODY {     scrollbar-arrow-color: #FFDEAD;     scrollbar-shadow-color: #B5C2D5;     scrollbar-face-color: #B5C2D5;     scrollbar-highlight-color: #FFDEAD;     scrollbar-darkshadow-color: #FFDEAD;     background: green;                          /* Удали это */ } .style1, .style5, .style7 { font-family: Geneva, Arial, Helvetica, sans-serif; } .style3 { color: #260; } .style5 { color: #663366; } .style7 { color: #663399; font-size: 20px; } .style9 { color: #FFFFFF } p {     text-indent: 2em;         margin-top: 0px;     margin-bottom: 0px;         padding-left: 20px;     padding-right: 20px; }     .style20 { color: #663399 } </style> <div class="qwe">     <p>Header1<br />Line1<br />Line2</p>     <p class="style9">Тут цвет белый!<br />Line1<br />Line2</p> <p>Header3<br />Line1<br />Line2</p>     </div>

Добавлено @ 16:50

Цитата(Urod @ 16.4.2005, 17:41)

Причем о-ой отступ сверху стоит, а текст все равно где-то по середине (по вертикали) получился. Aling=justify.

Не понял, о чём ты. Попробуй задать тому блоку, в котором текст, такой стиль:

Код

vertical-align: top;

Честно говоря, так и не поняла, зачем это:

Код

<div class="qwe">     <p>Header1<br />Line1<br />Line2</p>     <p class="style9">Тут цвет белый!<br />Line1<br />Line2</p> <p>Header3<br />Line1<br />Line2</p>     </div>

И без этого все правильно работает
Добавлено @ 17:38
Догадываюсь, что это надо, чтобы не писать каждый раз <p class="style9">, но, блин, все равно пока надо это все писать
Добавлено @ 17:44
Вот эта строчка

Код

<p class="style9">Тут цвет белый!<br />Line1<br />Line2</p>

явно посвящна тому, чтобы все <р> класса="style9" были белым цветом.
НО! если я все же с каждым <р> не буду писать class="style9", то цвет текста будет не белым

Ты знаешь, если у тебя идёт случайное чередование цветов ("белый" - "не белый"), то самым верным способом будет, пожалуй, прописывание стиля каждому <p>.


Это сообщение отредактировал(а) dm9 - 16.4.2005, 18:16

dm9 Угу. СПАСИБО за разъяснения!

А как можно в списке поставить справа отступ?
Вот код списка:

Код

<ul>                       <li class="style9">                         <div align="justify">Работа на любых трудно доступных участках</div>                       </li>                       <li class="style9">                         <div align="justify">Оперативность органзации работы, т.к. не требуется установка дополнительного оборудования (строительные леса, автовышка, люльки и т.п.)</div>                       </li>                       <li class="style9">                         <div align="justify"> Аккуратность выполнения работ (кровельные покрытия и фасады зданий остаются неповрежденными</div>                       </li>                     </ul>

Паддинги, как я понимаю, тут уже не помогут, т.к. это не является описание CSS.

Значит, так. По порядку )

Извини, не могу спокойно смотреть на этот код, поэтому буду говорить в том числе о том, о чём ты не спрашивала.

1. Если тебе надо задать class="style9" ВСЕМ элементам li данного ul, делается это гораздо проще:

Код

<style type="text/css"> ul.myul li { /* Тут описание css, повторяющее твой style9 */ } </style> <ul class="myul"> <li>...</li> <li>...</li> <li>...</li> </ul>

Так записанный стиль означает "все дочерние элементы li, предком которых является ul с прописанным классом myul".

2. ДИВ внутри li не имеет никакого смысла. Сделай так. Пропиши просто каждому li стиль css

Код

text-align: justify;

Сделать это можно многими способами.
Например, если у всех li одинаковый стиль, модифицируем немного предыдущий код:

Код

<style type="text/css"> ul.myul li { /* Тут описание css, повторяющее твой style9 */ text-align: justify; } </style> <ul class="myul"> <li>...</li> <li>...</li> <li>...</li> </ul>

Если же каждый li имеет свой стиль, то есть если каждому из них ты вынуждена прописывать

Код

<li class="style9">...</li> <li class="style10">...</li> <li class="style11">...</li>

- то в этом случае проще дообъявить стиль с выравниванием:

Код

.myalign { text-align: justify; }

и затем написать так:

Код

<li class="style9 myalign">...</li> <li class="style10 myalign">...</li> <li class="style11 myalign">...</li>

Написанные через пробел стили применяются вместе, то есть первому li будут назначены свойства, прописанные и в стиле style9, и в стиле myalign.

Также можно просто включить этот text-align: justify; в классы style9, 10, 11...

3. Теперь по сути вопроса - как изменить отступ справа.
Делается это очень просто. Прописываешь стиль для ul: <ul class="myul"> и затем добавляешь свойство css:

Код

ul.myul { padding-right: 20px; }

ИТОГО, получаем два варианта кода, в зависимости от того, что тебе надо.

1. (Если style9 применяется ко всем li)

Код

<style type="text/css"> ul.myul { padding-right: 20px; } ul.myul li { /* Тут описание css, повторяющее твой style9 */ text-align: justify; } </style> <ul class="myul"> <li>...</li> <li>...</li> <li>...</li> </ul>

2. Если каждый li имеет свой стиль.

Код

<style type="text/css"> .style9 {...} .style10 {...} .style11 {...} ul.myul { padding-right: 20px; } .myalign { text-align: justify; } </style> <ul class="myul"> <li class="style9 myalign">...</li> <li class="style10 myalign">...</li> <li class="style11 myalign">...</li> </ul>

Это сообщение отредактировал(а) dm9 - 20.4.2005, 22:01

dm9 Круто!!!!!!!!!! Столько примеров! Я, в принципе, догадываюсь, что в этом коде много чего можно упрастить, но не знала как, поэтому все приведенные тобой примеры осень для меня полезны!

Цитата(dm9 @ 20.4.2005, 22:58)

Написанные через пробел стили применяются вместе, то есть первому li будут назначены свойства, прописанные и в стиле style9, и в стиле myalign.

не знал этого, спасибо за справку

Вот этот код. Ничего не получилось: отступы справа не везде, появился какой-то желтый значок и если class="style9" не прописывать в каждом <li>, то текст списка будет не белым

Код

<style type="text/css">                      ul.myul {padding-right: 20px;}                      ul.myul li {color: #FFFFFF; text-align: justify;}                     </style>                  <ul class="myul">                  <li class="style9">Работа на любых трудно доступных участках</li>                  <li class="style9">Оперативность органзации работы, т.к. не требуется установка дополнительного оборудования (строительные леса, автовышка, люльки и т.п.)</li>                  <li class="style9">Аккуратность выполнения работ (кровельные покрытия и фасады зданий остаются неповрежденными</li>                     </ul>

Это сообщение отредактировал(а) Urod - 20.4.2005, 22:59

Второй код твой работает на ура. Объясняй тогда, что ты понимаешь под "отступами справа".

Добавлено @ 22:55
Мне кажется, мы в понятиях разошлись Для меня "отступ с правой стороны" это по умолчанию "padding-right"


Это сообщение отредактировал(а) dm9 - 20.4.2005, 22:55

Ой, все - все, разобралась!
Я совсем нетуда описание CSS вставляла
Добавлено @ 23:06
Просто из твоего примера я описание CSS вставила к сам код, а не в описание CSS, потому что посмотрела, ты когда про CSS писал, то так и называл код "CSS", а когда про код HTML, то так и называл код "HTML". А в последнем варианте не стал разбивать пример на "код в CSS" и "код HTML" - вот я немного и запуталась. Но теперь мне понятно

Это хорошо.

Тебе, а также Альянсу рекомендую посмотреть вот эту табличку (навеяно тем, что такая конструкция оказалась незнакомой: class="style1 style2"):
http://loc.stack.ru/projects/CSS2/selector.html#q1

Такие вещи, как задавание нескольких стилей одному элементу (class="style1 style2"), а также использование стилей для дочерних элементов очень сильно могут порой сократить код.
Можно сказать, основополагающая такая табличка

Это сообщение отредактировал(а) dm9 - 20.4.2005, 23:09

Цитата(dm9 @ 21.4.2005, 00:08)

Такие вещи, как задавание нескольких стилей одному элементу (class="style1 style2"), а также использование стилей для дочерних элементов очень сильно могут порой сократить код.

Это везде поддерживается?

Цитата(dm9 @ 21.4.2005, 00:08)

class="style1 style2"

Поддерживается Операми начиная с 6-й версии точно (возможно, и более ранними версиями).
Знаю, что поддерживается Firefox >= 1.0, IE 6.0.
С остальными браузерами не работал.

В спецификацц найти этого, к сожалению не смог. Найдёшь - покажи...

Вот, что мне хотелось бы получить: все тексты стиля 10 выравнить по центру (для чего я в CSS описала это под буквой "m", предполагаю, что это неправильно. А все тексты стиля 13 с параметрами буквы "p".
КАК показать в коде, что описания типа, text-align: center;vertical-align: center;, относятся к конкретному стилю 10, а не какому-либо другому, а описания стиля 13 - только к стилю 13! Я предположила, что надо эти описания располагать сразу под самим стилем. Правильно?
Ну вот, что у меня получилось, и, конечно же, не работает
}

Код

<style type="text/css">  BODY {   scrollbar-arrow-color:FFDEAD;   scrollbar-shadow-color:B5C2D5;   scrollbar-face-color:B5C2D5;   scrollbar-highlight-color:FFDEAD;   scrollbar-darkshadow-color:FFDEAD; } .style9,  .style10, .style13  {font-family: Arial, Helvetica, sans-serif} .style9,  .style10 {font-weight: bold; color: #7C93B3} m { text-align: center; vertical-align: center; } .style13 {font-size: 20px} p {     text-indent: 2em; /* otstup krasnoy stroki  */     margin-left: 10;     margin-right: 10;     margin-top: 20px; /* pustoe mesto sverxu ot p */     margin-bottom: 10px; /*  pustoe mesto snizu ot p  */     padding-left: 20px;  /*  otstup texta v p ot levoy ego granitsi */     padding-right: 20px; /* otstup texta v p ot pravoy ego granitsi */     vertical-align: top;     text-align: justify; } .style17 {color: #7C93B3} .style19 {font-family: Arial, Helvetica, sans-serif} </STYLE>

First of all, пойми, наконец, что цвета XXXXXX не существует! Существует цвет #XXXXXX.

Затем, vertical-align: center; - такого не бывает. То, что ты хочешь сделать, выглядит так: vertical-align: middle;

Теперь.
Рассказываю основы CSS

1.
Стили бывают разные. Некоторые задаются через свойство class. Такие стили начинаются с точки.

Код

<style type="text/css"> .qwe { color: orange } </style> <p class="qwe">К этому p стиль применяется</p> <p>К этому - нет</p> <div class="qwe">К этому div стиль применяется</div> <div>К этому - нет</div>

Некоторые относятся к конкретному тагу. Тут без точки, просто пишем таг.

Код

<style type="text/css"> p { color: orange } </style> <p class="qwe">К этому p стиль применяется</p> <p>К этому - ТОЖЕ ПРИМЕНЯТЕСЯ</p> <div class="qwe">К этому div НЕ применяется</div> <div>К этому - тоже НЕ применяется</div>

А некоторые сочетают оба эти метода, то есть сопоставляются только тем тагам, у которых прописан определённый class. Тут сначала указывается таг, а через точку - class

Код

<style type="text/css"> p.qwe { color: orange } </style> <p class="qwe">К этому p стиль применяется</p> <p>Сюда - не применяется</p> <div class="qwe">Сюда - не применяется</div> <div>Сюда - не применяется</div>

2.
Стиль можно задавать в несколько приёмов. Рассмотрим это на примере оптимизации кода.

Код

.style1 { font-weight: bold; text-decoration: underline; color: red; } .style2 { font-weight: bold; text-decoration: underline; color: green; } .style3 { font-weight: bold; text-decoration: underline; color: blue; }

Видно, что тут много раз задаётся один и тот же font-weight: bold и text-decoration: underline. Оптимизируем это дело.

Код

.style1, .style2, .style3 { font-weight: bold; text-decoration: underline; } .style1 { color: red; } .style2 { color: green; } .style3 { color: blue; }

На этом примере мы научились двум важным вещам.
ПЕРВОЕ. Один и тот же набор атрибутов (в данном случае, font-weight: bold; text-decoration: underline;) можно присвоить сразу нескольким стилям, задавая эти стили через запятую (.style1, .style2, .style3 {...}).
ВТОРОЕ. Одному стилю может соответствовать несколько описаний. В этом случае браузер обязан соединить все эти описания и сопоставить данному стилю все те атрибуты, которые задавались в разных местах. Например, здесь элемент со стилем style1 станет обладать шрифтом как жирным (font-weight: bold), подчёркнытым (text-decoration: underline), так и красным (color: red).

3.
Важное свойство, о нём я уже говорил. Применение нескольких стилей одному элементу. Можно задать в class два или более стилей через пробел, и применятся они все сразу.

Код

<style type="text/css"> .qwe { color: orange } .asd { font-weight: bold } </style> <p class="qwe asd">Этот шрифт будет как оранжевым, так и жирным</p>

Этими тремя пунктами всё не оканчивается, разумеется...

Попробуй на основе рассказанного сама разрешить свою задачу - это полезно...

Это сообщение отредактировал(а) dm9 - 23.4.2005, 18:28

Как можно указать текст в стиле teletype, т.е. он как на печатной машинке? Пробывала text-decoration: teletype; - не помогло

P.S. А про #XXXXXX и middle; - я знала, просто невнимательно посмотрела, да и сгоняли меня из-за компа

Это сообщение отредактировал(а) Urod - 24.4.2005, 00:27

Я вообще все в классы свела, т.к. у меня 4 типа текста. Т.о. ничего похожего на

Код

.style1, .style2, .style3 { font-weight: bold; text-decoration: underline; } .style1 { color: red; } .style2 { color: green; } .style3 { color: blue; }

у меня нет.
А есть только 4 класса:

Код

<style type="text/css">  BODY {   scrollbar-arrow-color:FFDEAD;   scrollbar-shadow-color:B5C2D5;   scrollbar-face-color:B5C2D5;   scrollbar-highlight-color:FFDEAD;   scrollbar-darkshadow-color:FFDEAD; } .asd { text-align: center; vertical-align: middle; font-weight: bold; color: #7C93B3 } .qwe {     text-indent: 2em; /* otstup krasnoy stroki  */     margin-left: 10;     margin-right: 10;     margin-top: 20px; /* pustoe mesto sverxu ot qwe */     margin-bottom: 10px; /*  pustoe mesto snizu ot qwe  */     padding-left: 20px;  /*  otstup texta v qwe ot levoy ego granitsi */     padding-right: 20px; /* otstup texta v qwe ot pravoy ego granitsi */     vertical-align: top;     text-align: justify;     font-size: 21px; /* по этому пункту я после кода вопрос задаю */     text-decoration: teletype; /* Не работает! Не знаю, как этот тип щрифта называется (это телетайп). Не подскажешь? */ } .zxc { text-indent: 2em; margin-left: 10; margin-right: 10; font-size: 20px; } .rty { text-align: center; font-size: 20px; } </STYLE>

- это нормально?
И вот еще с такой ерундой столкнулась: Когда меняю размер шрифта в font-size: 21px; (это в классе qwe) на 25px, например, в HTML-редакторе размер меняется, а при просмотре в браузерах (ИЕ и Мозилла) - НЕ меняется Почему?

Со стилями разобралась?

Насчёт шрифта:

Код

Попробуй так: <p style="font-family: 'Courier'">Лалала</p> Или так: <p style="font-family: 'Courier New'">Лалала</p> Или даже просто так: <p style="font-family: monospace">Лалала</p> Не совсем понимаю, что тебе надо.

И ещё раз - задавай каждый вопрос в новом топике. Преимущества очевидны как для тебя, так и не только: больше людей посмотрит на вопрос, и проще будет искать нужную информацию потом по поиску. Даже если это, казалось бы, мелкий вопрос, он может вылиться в очень длинное обсуждение


Это сообщение отредактировал(а) dm9 - 24.4.2005, 03:28

Ой, пока вчера писал предыдущее сообщение, ты своё запостила, а я и не заметил.

Цитата(Urod @ 24.4.2005, 02:21)

text-decoration: teletype;

Смотри описание text-decoration:
http://loc.stack.ru/projects/CSS2/text.htm...-striking-props
Там такого нет Попробуй то, что я написал в предыдущем посте.

Цитата(Urod @ 24.4.2005, 02:21)

А есть только 4 класса - это нормально?

Да нормально... Главное, чтоб удобно было. Тут один CSS показывать бесполезно, надо смотреть, насколько это оптимально выглядит в коде...

Цитата(Urod @ 24.4.2005, 02:21)

И вот еще с такой ерундой столкнулась: Когда меняю размер шрифта в font-size: 21px; (это в классе qwe) на 25px, например, в HTML-редакторе размер меняется, а при просмотре в браузерах (ИЕ и Мозилла) - НЕ меняется

По CSS не скажу, давай исходник полностью (с html вместе).

Цитата(Urod @ 24.4.2005, 02:21)

margin-left: 10;     margin-right: 10;     margin-top: 20px; /* pustoe mesto sverxu ot qwe */     margin-bottom: 10px; /*  pustoe mesto snizu ot qwe  */

Во-первых, 10 ЧЕГО? Просто 10 не бывает. Бывает 10px, 10pt, 10% итд.
Во-сторых, это записывается проще. Все эти маржины объединяются в один:
margin: <top> <right> <bottom> <left>.
В твоём случае это выглядит так:

Код

margin: 20px 10px 10px 10px;

dm9
Так, это мой CSS:

Код

<style type="text/css">  BODY {   scrollbar-arrow-color:FFDEAD;   scrollbar-shadow-color:B5C2D5;   scrollbar-face-color:B5C2D5;   scrollbar-highlight-color:FFDEAD;   scrollbar-darkshadow-color:FFDEAD; } .asd { text-align: center; vertical-align: middle; font-weight: bold; font-style:italic; color: #7C93B3; font-size: 20px; } p.qwe {     text-indent: 2em; /* otstup krasnoy stroki  */     margin: 20px 10px 10px 10px;         padding-left: 20px;  /*  otstup texta v qwe ot levoy ego granitsi */     padding-right: 20px; /* otstup texta v qwe ot pravoy ego granitsi */     vertical-align: top;     text-align: justify;     font-family: "Courier New", Courier, mono;     font-size: 16px; } .zxc { text-indent: 2em; margin-left: 10; margin-right: 10; font-family: "Times New Roman", Times, serif; font-size: 18px; } .rty { text-align: center; font-family: "Times New Roman", Times, serif; font-size: 18px; } </STYLE>

А это HTML:

Код

<tr>                 <td width="791" height="281" colspan="2"><p class="qwe"> С каждым годом число зданий с элементами из стекла, неуклонно растет. Архитекторские идеи становятся все более  авангардными. Нетрудно себе представить, как безинтересно сморелись бы эти здания, если бы их стекла были грязными. </p>                   <p class="qwe">Пристижные офисы, элитные дома - их необходимо поддерживать в безусловной чистоте. А если это - магазин, кафе, автосалон или торговый комплекс? Понятно, что грязные, невымытые стекла ветрин, окон  оттолкнут клиента и спровоцируют его обратиться к услугам Вашего конкурента, у которого стекла здания в чистоте.</p>                   <p class="qwe">Чистое, ухоженное здание - это &quot;визитная карточка&quot; Вашего предприятия, а для клиента - приглашение зайти к Вам! </p></td>               </tr>             </table>             <div align="center">               <table width="744" bordercolor="#7C93B3" border="2">                 <tr>                   <td height="60"><p class="asd">Услуга</p></td>                   <td width="183"><p class="asd">Единица<br />измерения</p></td>                   <td width="219"><p class="asd">Цена/ ед. измерения<br>(руб.)</p></td>                 </tr>                 <tr>                   <td><p class="zxc">Мойка стекол</p></td>                   <td><p class="rty">1 кв. м</p></td>                   <td><p class="rty">30</p></td>                 </tr>

Возможно, еще где-то можно оптимизировать, но больших ошибок я, вроде, уже не вижу
И, самое главное, я со своими вопросами разобралась - ВСЕ РАБОТАЕТ!

Это сообщение отредактировал(а) Urod - 24.4.2005, 20:21

Цитата(Urod @ 24.4.2005, 21:17)

ВСЕ РАБОТАЕТ!

Я счастлив
Несколько замечаний

width="791" - это очень неправильно. Лучше делать "резиновый" дизайн, то есть подстраивающийся по ширине под окно браузера. Но это субъективно. Если уж делаешь фиксированную ширину и стараешься подогнаться под 800х600, максимальная ширина должна быть 780 пикселей (можно чуть больше, кажется, но на пару пикселей максимум). И 780 - это ширина всей таблицы, а не ячейки. Чтобы делать "резиновый" дизайн, надо всё задавать в процентах.

Непонятно, зачем ты поставила высоту height="281" - всё равно ячейка раздвигается...

p внутрь td вставлять тоже не стоит

У класса .zxc лучше прописать text-align: left; Никогда не знаешь, какие умолчания стоят на каких-нибудь линуксоидных браузерах. Я так недавно сам попался...

И ещё. Лебедев тебя за дефисы выгнал бы из своей конторы Я там давал как-то сслку на "Типограф", который дефисы расставляет как положено. Дефис и тире - разные вещи

И всё-таки, ты забыла поставить # перед кодами цветов )

В общем, я немного оптимизировал CSS и HTML. Попробуй разобраться. В общем, в чём не разберёшься - не страшно, для первого раза получилось хорошо

Код

<style type="text/css"> BODY {     scrollbar-arrow-color: #FFDEAD;     scrollbar-shadow-color: #B5C2D5;     scrollbar-face-color: #B5C2D5;     scrollbar-highlight-color: #FFDEAD;     scrollbar-darkshadow-color: #FFDEAD; } tr.asd td {     text-align: center;     vertical-align: middle;     font-weight: bold;     font-style: italic;     color: #7C93B3;     font-size: 20px; } div.qwe {     width: 780px; } div.qwe p {     text-indent: 2em;     margin: 20px 30px 10px 30px;     vertical-align: top;     text-align: justify;     font-family: "Courier New", Courier, mono;     font-size: 16px; } .zxc, .rty {     font-family: "Times New Roman", Times, serif;     font-size: 18px; } .zxc {     text-align: left;     text-indent: 2em;     padding-left: 10px;     padding-right: 10px; } .rty {     text-align: center; } </STYLE> <div align="center">     <div class="qwe">         <p>С каждым годом число зданий с элементами из стекла, неуклонно растет. Архитекторские идеи становятся все более авангардными. Нетрудно себе представить, как безинтересно сморелись бы эти здания, если бы их стекла были грязными.</p>         <p>Пристижные офисы, элитные дома — их необходимо поддерживать в безусловной чистоте. А если это — магазин, кафе, автосалон или торговый комплекс? Понятно, что грязные, невымытые стекла ветрин, окон оттолкнут клиента и спровоцируют его обратиться к услугам Вашего конкурента, у которого стекла здания в чистоте.</p>         <p>Чистое, ухоженное здание — это &quot;визитная карточка&quot; Вашего предприятия, а для клиента — приглашение зайти к Вам!</p>     </div>     <table width="744" bordercolor="#7C93B3" border="2">         <tr class="asd">             <td height="60">Услуга</td>             <td width="183">Единица<br />измерения</td>             <td width="219">Цена/ ед. измерения<br>(руб.)</td>         </tr>         <tr>             <td class="zxc">Мойка стекол</td>             <td class="rty">1 кв. м</td>             <td class="rty">30</td>         </tr>     </table> </div>

Добавлено @ 00:01
PS Разумеется, до состояния "идеально" я код не доводил, но сейчас работать должно нормально во всех более-менее приличных браузерах.

Добавлено @ 00:03
Ну и, конечно, надо понимать, что
scrollbar-arrow-color: #FFDEAD;
scrollbar-shadow-color: #B5C2D5;
scrollbar-face-color: #B5C2D5;
scrollbar-highlight-color: #FFDEAD;
scrollbar-darkshadow-color: #FFDEAD;
- всё это только под Internet Explorer.


Это сообщение отредактировал(а) dm9 - 25.4.2005, 00:02

Что-то у меня классы .zxc и .rty не работаю. Почему?
Вот ссылка на страничку: http://marinavladimirovna.nm.ru/Site/Pages...gie_raboty1.htm
P.S. По каким-то непонятным мне причинам страничка по ссылке с зазором (что плохо), а у меня на компе без (что хорошо), хотя код один и тот же.

Вопрос снят: я скобку после названия класса ставила через пробел - так не правильно!