[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: как такое реализовать
grisharecords
Мне нужно сделать следующее.
Вот есть текст
Мама мыла раму рама мыла маму
Папа мыла каму кама мыла папу

Мне нужно чтобы автоматически межстрочный интевал был больше, т.е. если эти две строки не влазеют в окно браузера то они будут выглядить вот так
Мама мыла раму
рама мыла маму
(отступ)
Папа мыла каму
кама мыла папу

и ещё чтобы первое слово скажем так до точки автоматически делалось жирным
ляляля. турум пум пум

+ <p> делает сильно большой отступ между строками, можно както через css указать чтобы каждую строку был чуть больше межстрочный итервал? Или через что такое можно сделать?



Спустя 43 минуты, 32 секунды (12.06.2007 - 13:46) zaxar написал(а):
Найди прозрачную GIF-картинку 1х1 пиксел и вставь ее в начало строки про папу, предварительно указав необходимые тебе размеры.

Спустя 14 минут, 1 секунда (12.06.2007 - 14:00) grisharecords написал(а):
Цитата(zaxar @ 12.6.2007, 10:46) [snapback]22535[/snapback]
Найди прозрачную GIF-картинку 1х1 пиксел и вставь ее в начало строки про папу, предварительно указав необходимые тебе размеры.

мне нужен отспум между строк, а не вначале строки

Спустя 51 минута, 30 секунд (12.06.2007 - 14:52) Timok написал(а):
Конкретного способа к своему стыду не знаю, поэтому буду рассуждать.
- Отступ между блоками определяется свойством margin
- Раз отступ должен менятся в зависимости от ширины блоков, значит его надо указать в процентах.
- Если мы укажем margin в процентах то с уменьшением ширины блока отступы будут уменьшаться (т.к. проценты в margin рассчитываются именно от ширины), но нам надо чтобы они наоборот - увеличивались.
- Чтобы они увеличивались можно установить margin в отрицательное число (получим обратную зависимость: меньше ширина - больше отступ). Но при таком раскладе, при увеличении ширины нижние блоки "убегают" наверх, далеко за пределы окна.
- Чтобы этого избежать воспользуемся float'ом - каждый следующий блок будет вставать не выше предыдущего. Но тогда они наложаться друг на друга.
- Чтобы не было "накладок" установим width:100% - тогда блоки не смогут залезать один на другой.

В итоге получилось что-то вроде:
Код
<style>
p {
margin:40px 0 -4% 0;
float:left;
clear:both;
width:100%;
}
</style>
<p>1Мама мыла раму рама мыла маму</p>
<p>2Папа мыла каму кама мыла папу</p>
<p>3Мама мыла раму рама мыла маму</p>


Если кто-то знает другие способы поделитесь.

2Zahar: не совсем понял про картинку - что она даст? приведи код...

Спустя 1 день, 2 часа, 29 минут, 45 секунд (13.06.2007 - 17:21) zaxar написал(а):
Цитата
2Zahar: не совсем понял про картинку - что она даст? приведи код...


http://exe.forclimate.ru/mama_rama.php

Спустя 2 минуты, 47 секунд (13.06.2007 - 17:24) zaxar написал(а):
Цитата
мне нужен отспум между строк, а не вначале строки


Если купишь книгу по HTML и изучишь синтаксис тега <img>, то узнаешь, что размеры картинки можно регулировать не только по ширине, но и по высоте.

См. пример выше.

Спустя 48 минут, 24 секунды (13.06.2007 - 18:13) Timok написал(а):
Цитата(zaxar @ 13.6.2007, 20:21) [snapback]22630[/snapback]
Цитата
2Zahar: не совсем понял про картинку - что она даст? приведи код...


http://exe.forclimate.ru/mama_rama.php


Zahar, ведь по задаче отступ должен появляться только когда строки не умещаются

т.е. здесь никакого отступа нет
Цитата
Мама мыла раму рама мыла маму
Папа мыла каму кама мыла папу

а тут он автоматом появляется
Цитата
Мама мыла раму
рама мыла маму
(отступ)
Папа мыла каму
кама мыла папу


а тут картинка просто увеличивает высоту блока. Если так, то это проще сделать через css-свойства height, line-height, padding, margin и т.д.


_____________
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.