| |
|
|
| | Если написать
<p>Первая строка</p>
<p>Вторая строка</p>
|
то строки выводятся не рядом, а с некоторым расстоянием одна от друой (с промежутком в пустую строку). Насколько я понял, так и должно быть.
Проблема снимается, если дать код:
<p style="margin-top: 0; margin-bottom: 0">Первая строка</p>
<p style="margin-top: 0; margin-bottom: 0">Вторая строка</p>
|
Теперь строки плртно прижаты друг к другу.
Есть ли у этого кода аналог в css?
================
Не сработало
margin-top: 0pt;
margin-bottom: 0pt;
|
| |
| |
|
|
| |
|
|
| |
для: Владимир55
(11.11.2009 в 16:27)
| | | нужно выбрать элемент для которого указываются стили
P{
margin-top: 0pt;
margin-bottom: 0pt;
} | |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.11.2009 в 16:59)
| | | А так нельзя почему?
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<style type="text/css">
<!--
body {
margin-left: 15px;
margin-top: 0pt;
margin-right: 20px;
margin-bottom: 0pt;
}
-->
</style></head>
<body>
<p>Первая строка</p>
<p>Вторая строка</p>
</body>
|
| |
| |
|
|
| |
|
|
| |
для: Владимир55
(11.11.2009 в 17:15)
| | | Во-первых, потому, что абсолютно ВСЯКИЙ тег имеет внешние отступы (margin'ы) - и тег <BODY>, и тег <P> (и все остальные).
Когда вы пишете
body {
margin-left: 15px;
margin-top: 0pt;
margin-right: 20px;
margin-bottom: 0pt;
}
|
, то вы устанавливаете внешние отступы для тега <BODY>, относительно границ окна браузера. К тегам <P> эта ваша установка не имеет никакого отношения.
Во-вторых, всякий тег по умолчанию имеет какие-то предустановленные ("дефолтные") внешние отступы (margin'ы). Тег <P>, кстати, тем единственным отличается от тега <DIV>, что тег <P> во всех браузерах имеет какие-то ненулевые дефолтные значения внешних отступов (margin'ов) - а у тега <DIV> по дефолту они нулевые.
В-третьих, вашу запись стилей можно значительно упростить. Всякое свойство, касающееся четырёх сторон (margin, padding, border, etc...) можно записывать в виде:
{свойство: сверху справа снизу слева;}
|
Соответственно, всё то, что вы написали для тега <BODY> в четыре строки, вполне можно уместить в одной, а именно:
body {margin: 0 20px 0 15px}
|
Обратите внимание, что для нулевых значений использовать размерность не надо. Ибо, согласитесь, если у вас в кошельке ВООБЩЕ НЕТ денег, то вы так и говорите, а не указываете - 0 рублей, 0 долларов, 0 евро, 0 тугриков... НОЛЬ, он и в Африке - НОЛЬ!
В-четвёртых, НИКОГДА не пользуйтесь внутренним комментированием ни для блока <STYLE>, ни для блока <SCRIPT>. Да, я в курсе, что многие сайты так советуют... Но советы эти устарели лет на пятнадцать - браузеров, которые бы не понимали тегов <STYLE> и <SCRIPT>, вы уже никогда в своей жизни не встретите. Они вымерли, как мамонты и динозавры; исчезли с лица земли, как болезнь оспа. Поэтому, отправляясь в лес, дубинку против мамонтов или динозавров с собою никто уже не берёт, да и прививку от оспы уже почти тридцать лет не делают ни одному новорождённому... | |
| |
|
|
| |
|
|
| |
для: АЯ
(11.11.2009 в 17:51)
| | | Спасибо, дело проясняется!
Комментарии Dreamweaver вставляет автоматически.
И он же пишет единицы измерения для нулевых значений.
И в несколько строк.
Ну, что тут поделать? Такой уж он редактор!
Но теперь я буду знать их истинную сущность, и при ручном написании последую Вашему совету.
Скажите, а можно ли задать правила так, чтобы:
- одно общее правило, включающее в себя шрифт и отступы, действовало на весь текст;
- частное правило, касающееся центрирования, действовало на определенный фрагмент? | |
| |
|
|
| |
|
|
| |
для: Владимир55
(11.11.2009 в 18:14)
| | | >"- одно общее правило, включающее в себя шрифт и отступы, действовало на весь текст;"
Селектор * ("универсальный селектор") подразумевает - "абсолютно для всех тегов документа"
>"- частное правило, касающееся центрирования, действовало на определенный фрагмент?"
В качестве селекторов в общем случае могут выступать только теги - по имени тега, по имени класса, по значению id тега. В некоторых новейших браузерах (например, в MSIEv7+) возможно использовать так называемые "комбинаторные селекторы" с использованием комбинаций из всяких-разных значков (* = ^ ~ +), но, повторяю - только в самых новейших. Поэтому их использование ещё годик-два рекомендовать нельзя, чуть менее свежие браузеры (которых ещё много) проигнорируют это дело.
Универсальный контейнер <DIV> для этого и существует. Можно поместить весь ваш "фрагмент" в <div class="fragment" > и прописать в стилях
div.fragment * {нужные правила для всех тегов, входящих в <DIV class="fragment">, КРОМЕ самого <DIV class="fragment">}
или
div.fragment {нужные правила для всех тегов, входящих в <DIV class="fragment"> И ДЛЯ самого <DIV class="fragment">}
|
| |
| |
|
|
| |
|
|
| |
для: АЯ
(11.11.2009 в 17:51)
| | | > Во-первых, потому, что абсолютно ВСЯКИЙ тег имеет внешние отступы...
Inline элементы и <div> не имеют отступов. | |
| |
|
|
| |
|
|
| |
для: Саня
(11.11.2009 в 19:10)
| | | Имеют.
Просто ПО-УМОЛЧАНИЮ у Inline-элементов и у тега <div> ИМЕЮЩИЕСЯ внешние отступы равны нулю.
Но никто не мешает вам изменить эти значения с нуля на что-либо иное:
<span style="margin-left: 245px">SPANspanSPAN</span>
<div style="margin-left: 123px">DIVdivDIV</div>
|
| |
| |
|
|
| |
|
|
| |
для: АЯ
(11.11.2009 в 19:27)
| | | Попытался воплотить Ваш урок:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<style type="text/css">
<!--
body {
background-color: #FC6;
margin: 15px 15px 15px 15px;
}
* {
font: large/0px Arial, Helvetica, sans-serif;
margin-top: 0;
margin-bottom: 0;
}
.s1 {color: #F39;}
-->
</style>
</head>
<body>
<p> </p>
<p>строка</p>
<p>Продолжение</p>
<p> </p>
<p> </p>
<p class="s1">Красный цвет</p>
</body>
</html>
|
Цвет есть. Но почему -то все 7 строк пишутся одна на другую.
Почему? Из-за:
margin-top: 0;
margin-bottom: 0;
|
| |
| |
|
|
| |
|
|
| |
для: Владимир55
(11.11.2009 в 19:33)
| | | Что означает large/0px?
Кто вам "спроворил" эту строку?
font: large/0px Arial, Helvetica, sans-serif;
|
Уберите её и всё будет OK.
Или хотя бы замените на
font: large Arial, Helvetica, sans-serif;
|
Кроме того, при одинаковых значениях "сверху, справа, снизу, слева" можно писать проще:
вместо
margin: 15px 15px 15px 15px;
можно
margin: 15px;
|
| |
| |
|
|
| |
|
|
| |
для: АЯ
(11.11.2009 в 19:27)
| | | > внешние отступы равны нулю
Равносильно тому что их нет. Когда у вас в кошельке совсем нет денег, вы же не говорите "у меня ноль денег"?
[поправлено модератором] | |
| |
|
|
| |
|
|
| |
для: Саня
(11.11.2009 в 20:28)
| | | Всякий элемент имеет внешний отступ,
Всякий элемент имеет бордер (с шириной, стилем и цветом),
Всякий элемент имеет внутренний отступ.
От того, что какие-то из этих свойств у каких-то элементов разработчики браузеров сделали изначально нулевыми, никак не следует, что самих этих свойств у этих элементов нет.
[поправлено модератором] | |
| |
|
|
| |
|
|
| |
для: АЯ
(11.11.2009 в 20:50)
| | | Что означает large/0px?
Кто вам "спроворил" эту строку?font: large/0px Arial, Helvetica, sans-serif;
Это, опять же, творение Dreamweaver. Так получается при создании правила, точнее при задании шрифта и интервала между строками line-height. Если нулевое значение не указать, то получается вывод через пустую строку.
Как я понял, аналогичные результаты дает конструкция
font: large Arial, Helvetica, sans-serif;
line-height: 0px;
|
====================
За подсказку по универсальному селектору хочу выразить особую благодарность - очень уж она кстати! | |
| |
|
|
