2013-06-01 3 views
1

Я использую тег <h2> для своих названий. Под ним есть тег <hr />. Пространство между заголовком и <hr /> слишком велико.Отображение встроенного или отрицательного поля

Я бы использовал display: inline; на теге <h2>, отрицательный margin-top на <hr />, или еще что-нибудь еще?

enter image description here

+0

Вы пытаетесь использовать '


' в качестве подчеркивания? Горизонтальное правило предназначено для разделения содержимого. То, что вы должны использовать, - это нижний край на h2. – cimmanon

+0

Да. '


' - 2 строки, белый и серый. Как мне это сделать, используя «border-bottom»? –

ответ

3

Не используйте hr элемент между заголовком и содержанием она введения. (*)

Лучше использовать CSS:

h2 { 
    border-bottom: 2px groove white; 
} 

, чем при использовании структурного элемента для целей моделирования.

(*) Его семантика больше похожа на end of one section, start of another (согласно Hixie через HTML5doctor). Я использовал его довольно много для моего проекта в прошлом году, но, честно говоря, вы также можете жить без ...;) Также довольно сложно настроить кросс-браузер, что совсем не помогает!

EDIT: OP волновало рендеринга по умолчанию ч, нашел лучший способ, чем мой первоначальный стиль 1px solid #CCC с его 2px groove white (см комментарии ниже), его редактировать был отклонен, но это хорошо для меня, так что я отредактировал мой ответ в любом случае.

+0

Обратите внимание: если вы хотите, чтобы это выглядело как горизонтальное правило, вам нужно использовать 'border-bottom: 2px inset # CCC'. Лично я считаю, что 1px сплошные границы выглядят лучше. – cimmanon

+0

'


' - 2 линии, белый и серый. Как мне это сделать, используя «border-bottom»? –

+0

@cimmanon Спасибо за ключевое слово вставки! Не мог вспомнить, как лучше всего сделать этот вид двухцветных границ, так как мне редко приходится конструировать это. Или когда это происходит, это между горизонтальными элементами списка ... – FelipeAls

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