Блог

Главная - Вопросы по программированию - Удалить белый bg из заголовка / навигации поверх изображения героя

Удалить белый bg из заголовка / навигации поверх изображения героя

#html #css #web

#HTML #css — код #паутина

Вопрос:

Плохо сформулированный вопрос, однако, я думаю, что сейчас я работаю над какой-то курсовой работой, это очень простой HTML-сайт. Я пытаюсь наложить логотип и навигацию на изображение моего Героя. Проблема, с которой я сталкиваюсь, заключается в попытке сделать белый bg из заголовка div прозрачным или полностью удалить его и разместить навигацию и логотип в верхней части изображения героя.

Ответ №1:

Надеюсь, что приведенный ниже CSS может вам помочь. Добавьте этот CSS в свой файл CSS.

Я использовал абсолютную позицию для наложения панели навигации. вы можете более подробно прочитать о позициях в CSS — https://www.w3schools.com/cssref/pr_class_position.asp

 header {
position: absolute;
}

введите описание изображения здесь

Комментарии:

1. Спасибо, это сработало. Я немного раздражен, что не понял этого — я пробовал все, кроме этого! Когда я меняю положение, оно удаляет мое подчеркивание и т. Д. При наведении курсора мыши. Почему это происходит?

Ответ №2:

Самый простой способ сделать это — просто переместить раздел заголовка в раздел героя вот так:

   <div class="hero">
       <a href="">
    <h1 class="logo"><strong>FOTO.</strong></h1>
  </a>
<header>
    <nav>
      <ul>
        <li><a href="#hero">HOME</a></li>
        <li><a href="#about">PORTFOLIO</a></li>
        <li><a href="#about">SERVICES</a></li>
        <li><a href="#about">ABOUT</a></li>
        <li><a href="#contact">CONTACT</a></li>
      </ul>
    </nav>
</header>
 <span class="herotext">THE WILD THROUGH A LENSE</span> 

  </div>