Как сделать, чтобы при загрузке страниц на сайте меню всегда оставалось сверху фиксировано, а новые страницы грузились ниже него?

ilya granovskyy,

https://www.santaplantas.com/ в этом сайте есть реализация такого меню

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

Если вы действительно хотите, чтобы это происходило без перезагрузки, то нужно гуглить SPA.

Если как в сайте образце, то любую CMS.

Как сделать, чтобы при загрузке страниц на сайте меню всегда оставалось сверху фиксировано, а новые страницы грузились ниже него?

golentor,

float:left

Вы, простите, в каком году живете?
Уже очччень давно можно перестать использовать флоаты для чего они не предназначались.

Почему при просмотре страницы с помощью DevTools не отображаются определенные блоки?

Светлана, для этого не нужен абсолют
https://jsfiddle.net/m6x8w9rz/
размеры поставила первые какие в голову пришли

Как расположить элементы?

intriga93, ширину забыли https://jsfiddle.net/7g81a6yp/

Как расположить элементы?

intriga93, что именно не так?
Чтобы элементы не разрывались на 2 колонки, им нужно задатьdisplay inline-block

Как передвигать объект при скролле страницы?

скобки у margin лишние

tickerMin.style.marginLeft = "-" + window.pageYOffset + "px";

Как сделать такой же блок в css и html как на картинке?

Как сверстать данный блок?

Это список, ul.

Его можно верстать флексами, гридами, columns...

Если плюсики рабочие, то это button, если нерабочие, а просто украшения, то псевдоэлементы.

Почему при просмотре страницы с помощью DevTools не отображаются определенные блоки?

Вы задали для intro

min-height: 820px;
background: url(img/introbg.jpg) center no-repeat;

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

Зачем хедеру вообще абсолют?

p.s. reset был актуален в 2007 году. Если хочется использовать сброс, то тогда уж normalize и желательно не бездумно, а только то, что вам оттуда нужно.

Как отменить подчеркивание у последнего элемента?

Norum,

я сделал так

Если нравится менять 3 раза одно и то же свойство, то почему бы и нет.
Завязывать на порядок следования то, что от него не зависит не лучшая практика. Если вы захотите поставить этот элемент в центр, он ведь не перестанет быть не подчеркнутым. Т.е. он не подчеркивается не потому что он последний, а потому что там только цифры.

объясните поподробнее, почему картинки внутри ссылок не являются контентными?

А какой alt вы им пропишете?
Потом представьте, что вы гуглите по картинкам по тексту из alt.
И найдется ваш сайт. Этот сайт даст ответ на запрос из поиска - нет.
Это один вариант размышлений.
Другой - если отвалятся стили и этой картинки не будет, смысл потеряется? Нет. Но должен остаться текст.

Для ссылок, кнопок и т.д., если в их оформлении есть только картинка, то для доступности в неё добавляют спан с классом visually-hidden (легко гуглится по "доступное скрытие visually-hidden", что в него пишут). Саму картинку ставят фоном/псевдоэлементом.

<a href="vk"><span class="visually-hidden">наша группа в VK</span></a>

Или используют атрибут aria-label.
Любой из этих вариантов подходит для вашей ссылки. Второй подходит для читалок, первый - универсальный, сработает и для читалок и на случай если пропадут стили.

Как отменить подчеркивание у последнего элемента?

Norum, или для li или для a - по 2 класса.
Например
a class="footer__link footer__link--compare"
в .footer__link одинаковые для всех ссылок свойства
в .footer__link--compare - уникальные

Черточки это по БЭМу, если его не используете, можете писать просто "footer-link-compare footer-link-compare"

Как сделать отступы и другие элементы в соответствии с макетом Perfect Pixel?

размеры беру из Avocode, Photoshop, Figma, но все равно отступы margin, padding отличаются от макета при просмотре в плагине Perfect Pixel при наложении макета.

Логично. И не ждите.

Как сделать чтобы отступы были как в макете в соответствии с Perfect Pixel?

Использую плагин Perfect Pixel для Google Chrome

Вот и отлично.
Подложили картинку, поправили размеры, отступы и т.д.

Пробовал разный масштаб и для разных экранов проверял результат один и тот же.

В браузере и в операционке(!) должен стоять масштаб 100%

подскажите насколько актуальна сейчас в 2020 и в 2021 году верстка Perfect Pixel в реальной работе

Заказчики бывают разные. И вы можете не брать заказы у которых строгие требования к PP или увеличивать стоимость.
Для прояснения посмотрите коротенькую видяшку, 7 минут всего: https://www.youtube.com/watch?v=xFZWHLjNXdI

Дelete answerrrr?

Павел Корнилов,

что на локальном, что на реальном сервере слеш будет указывать на ROOT директорию сайта, как я и говорил выше.

Слеш - да.
А вот путь может оказаться разным.

Дelete answerrrr?

tolendy017, Только прислушиваясь к этому совету, имейте в виду, что если вы откроете страницу в браузере просто так, без сервера, то пути будут считаться от диска, на котором расположены файлы. А если поднимете localhost, то в зависимости от настройки сервера. А на живом сайте от домена.

Так что всё таки придется разобраться как писать пути в разных случаях.
Начать можно отсюда https://webref.ru/html/value/url

Можно ли через Bootstrap, хорошо научиться HTML CSS?

Можно, если вы напишете свой Bootstrap.

Но это не предел и останутся вопросы семантики, доступности и т.д.

Дelete answerrrr?

1. Включите показ расширений файлов в настройке папок.
2. Посмотрите ошибку в консоли. Браузер пишет где ищет картинку. И сравните с тем, где она на самом деле находится.

Как сделать якори на сайте с повторами id?

Андрей Широких,

Видится вариант создать скрипт с условием, что если разрешение экрана такое-то, то элемент меняет свой id. Это ведь возможно?

Да, конечно.

Еще вариант, что в блоке с id у вас лежат 2 других блока и уже их видимость вы меняете в зависимости от размера экрана.

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

Как сделать якори на сайте с повторами id?

Андрей Широких,

О боже, а могли бы просто ответить - вариантов нет, исправляйте имеющиеся блоки и меню.

Я вам сразу написала, что одинаковые id существовать не могут.
Вариантов решений полно.
Модифицировать меню, изменить блоки, удалить лишние и еще пачка, но мы не видим макет и того, точ у вас там вообще происходит.

У меня как раз таки разные блоки.

Я пытаюсь выяснить на кой черт разные блоки имеют одинаковые id.
Подозреваю, что блок один, просто выглядит по-разному и для этого сдублирован.

Как сделать якори на сайте с повторами id?

Андрей Широких, в чем различия блоков? Постарайтесь использовать адаптивную верстку, а не дублирование кода.

Как сделать якори на сайте с повторами id?

Андрей Широких, зачем нужно 2 блока с одинаковыми id="about" и т.д.?

Как сделать якори на сайте с повторами id?

Андрей Широких, Выход - не использовать одинаковые id.

Для начала разобраться как они появились и какую задачу пытались решать. И решить ее по-другому.