2014-03-13 4 views
1

HTML n00b здесь. Я не могу вставить мой фактический код, потому что это от работы, но в основном яУменьшение интервала между двумя строками в HTML

<p>Some text</p> 
<p><a href="SomeSite.com">Some more text</a></p> 

, и я хочу, чтобы эти линии должны быть уложены друг на друга в то время как остальные строки на странице поддержания их нормального интервала между друг другом.

Я пытался делать

<p style="padding-bottom: 0px">Some text</p> 
<p><a style="padding-top: 0px" href="SomeSite.com">Some more text</a></p> 

, но это не сработало. Похоже на это следует работа.

Пожалуйста, покажите мне, как это сделать в правильной HTML-моде и объясните, почему моя попытка не удалась.

ответ

3

Вы хотите сделать что-то вроде этого:

<p>Some Text <br /> <a href="">Some more text</a></p> 

<br /> является разрыв строки, так что вы можете иметь все в 1 абзац и разрыв строки приведет к следующей строке под первым. Затем вы можете использовать line-height:10px

<p style="line-height:10px;">Some Text <br /> <a href="">Some more texth</a></p> 

Вы можете изменить размер пикселей на любой другой.

Если вам НЕОБХОДИМО иметь два отдельных абзаца, вы можете заключить их в контейнер и дать контейнеру line-height.

<div style="line-height:10px"> 
    <p>line 1</p> 
    <p><a>line 2</a></p> 
</div> 
1

использовать span тег вместо p тег как p тег автоматически начнет в новой линии

так что вы должны либо использовать display:inline в CSS или использовать span тег

<span>Some text</span> 
<span><a href="SomeSite.com">Some more text</a></span> 

DEMO

Я просто неправильно понял ваш вопрос, поэтому у меня есть ответ ниже HTML

<p>Some text</p><br/> 
<p><a href="SomeSite.com">Some more text</a></p> 

CSS:

p{ 
    display:inline; 
} 

DEMO

+0

Это не означает, что спрашивает плакат. Это просто помещает две строки в одну строку. То, что плакат хочет сделать, - это иметь две линии прямо друг над другом. –

0

Не совсем уверен, что вы имеете в виду.

Но похоже, что вы хотите разбить линию, а не абзац.

Итак ...

<p>Sometext<br><a href="#">Some other text</a></p> 

<br> тег для строк.

Для получения дополнительной информации не забудьте проверить w3school: http://www.w3schools.com/html/html_paragraphs.asp Это отличный ресурс для изучения веб-дизайна.

Смежные вопросы