Липкие заголовки обложки якорный текст

У меня есть липкий заголовок, который плавает на остальной части страницы. Когда я ссылаюсь на якоря страницы, конечно, это свитки, так что якорь находится вверху страницы. Однако, когда это происходит, заголовок скрывает текст ниже.

Есть что-нибудь, чтобы это исправить? Я не могу просто переместить якорь вниз, потому что на странице их много, и у каждого из них разное количество текста. Сначала я хотел как-то прокрутиться до некоторой высоты над якорем.

Спасибо, Дэвид

 David Thomas18 мая 2012 г., 23:47
Думаю, не без JavaScript.
 Yoav Kadosh18 мая 2012 г., 23:56
именно то, что я собирался сказать, хотя это зависит от того, насколько высоко ваш заголовок ...
 Gordon Gustafson18 мая 2012 г., 23:56
Вы всегда можете быть «тем парнем» и иметь фактический контент в рамке ниже липкого нижнего колонтитула, но это откроет массу других вопросов, с которыми вы определенно не захотите иметь дело. Yourhtmlsource.com / кадров / goodorbad.html
 Steve18 мая 2012 г., 23:54
Не обязательно лучший подход, но если ваш макет / дизайн это позволяет, вы можете задать для якоря отступ, равный высоте заголовка.

Ответы на вопрос(2)

целевой псевдоэлемент может быть тем, что вы ищете. С помощью: target вы можете обращаться к элементу, на который указывает символ #. Подробнее об этомВо

 twknab26 июл. 2018 г., 09:05
Я видел так много сложных решений для такой простой задачи, и только нацеливание:target (скорее, чем:target::before как я видел много мест) было лучшим решением для меня. В моем случае я вставил разделитель между каждым заголовком, и на самом деле у меня есть точка привязки к разделителю, чтобы добавить еще немного места. Получал немного прикольное поведение (где не каждый элемент был заполнен должным образом), но, казалось, решил мою проблему (несмотря на то, что мое решение было хакерским на ощупь). Спасибо за отличный совет.
 hoytdj19 мая 2012 г., 23:09
The: целевой селектор выглядит так, как будто это то, что я хочу. Но тогда как я могу заставить окно двигаться вниз только с помощью CSS? Я могу использовать javascript, конечно, но я бы не хотел.
 albinohrn20 мая 2012 г., 12:13
Страница будет прокручиваться вниз, как и раньше, но теперь с помощью селектора: target вы добавляете дополнительный отступ, чтобы переместить элемент вниз. Чтобы он больше не скрывался за липким заголовком.

A.named:target {
    display: inline-block;
    height: 120px;
    margin-top: -120px;
}

Затем я применил класс «named» к любому тегу привязки, к которому я хочу, чтобы браузер прокручивал до. Это добавляет 120px пространства между верхней частью браузера и нижней частью элемента, который содержит привязку - около 80px для заголовка и еще 40px для компенсации высоты заголовков H2, на которые я ссылался ... И, с отрицательное поле отменяет положительное, оно не влияет на внешний вид моей страницы.

Надеюсь это поможет

Ваш ответ на вопрос