Skocz do zawartości
PL
Szukaj na Pecetowiczu
Nowe Szukaj Zaloguj Dołącz
  • Utwórz konto

Pojawianie się obrazka po najechaniu na napis--Pomocy!

Udostępnij
Rekomendowane odpowiedzi

Tworest

Nie wiem dlaczego nie pojawiają sie inne obrazki

HTML 

<body>
  <div id="lewa">
    <a href="#" class="show-img"><h1>KOŁO</h1></a>
  </div>
  
  <div id="srodek">
    <a href="#" class="show-img"><h1>KWADRAT</h1></a>
  </div>

  <div id="prawa">
    <a href="#" class="show-img"><h1>TRÓJĄT</h1></a>
  </div>
</body>

SCSS 

#lewa
{
  width: 600px;
  height: 500px;
  background-color: blue;
  float: left;
  text-align: center;
  .container{
    max-width: 500px;
    margin:0 auto;
  }
  .show-img{
    position:relative;
  }
  .show-img:hover:after {
    content: url(kolo.png);
    display: block;
    position:absolute;
    left:0;
    z-index: 1000;
  }
}

#srodek
{
  width: 600px;
  height: 500px;
  background-color: gray;
  float: left;
  text-align: center;
  .container{
    max-width: 500px;
    margin:0 auto;
  }
  .show-img{
    position:relative;
  }
  .show-img:hover:after {
    content: url(kwadrat.png);
    display: block;
    position:absolute;
    left:0;
    z-index: 1000;
  }

}

#prawa
{
  width: 600px;
  height: 500px;
  background-color: red;
  float: left;
  text-align: center;
}


h1
{
  color: yellow;
  font-size: 50px;
  font-family: Arial;
}

.container{
  max-width: 500px;
  margin:0 auto;
}
.show-img{
  position:relative;
}
.show-img:hover:after {
  content: url(kolo.png);
  display: block;
  position:absolute;
  left:0;
  z-index: 1000;
}
Odnośnik do komentarza
Udostępnij na innych stronach

aXenDev

Wstaw to tutaj https://codepen.io/.

Odnośnik do komentarza
Udostępnij na innych stronach

Kontynuuj dyskusję

Dołącz do Pecetowicza, aby kontynuować dyskusję w tym wątku.

Zaloguj się
Zarejestruj się
Zadaj pytanie bez logowania
  • Dodaj nową pozycję...
  • Dodaj nową pozycję...