Logo w tle nagłówka jako odnośnik do strony


(tndek) #1

Witam. Ustawiłem pewien plik graficzny jako tło dla klasy określającej wygląd nagłówka:

#naglowek {

text-align:left;

height:120px;

background: url(img/logo.png);

text-indent: -9999px;

Usunąłem tekst, który był odnośnikiem do strony głównej (m.in. dlatego wpisałem text-indent) jednak mam problem z zadeklarowaniem pliku logo.png jako odnośnika do strony głównej. W jaki sposób to zrobić?


(mozilla007) #2

Nigdy tak nie eksperymentowałem tak szczerze powiedziawszy, ale najprościej można usunąć linie background i ręcznie do DIVa dodać obrazek i odnośnik. Jakoś nie mam pomysłu akurat na takie coś.


(mordesku) #3

najlepiej wrzuć diva w tag a czyli

[/code]


(tndek) #4

Niestety, obrazek będący tłem dla nagłówka nadal nie pełni funkcji odnośnika.


(Skicio) #5

To pewnie bardzo nieprofesjonalne podejście, ale można by wrzucić na nagłówek oddzielnego div'a z rozciągniętym, przeźroczystym obrazkiem o wymiarach 1x1 [px] i go zrobić jako link. Pewnie kiepskie rozwiązanie, ale liczą się chęci chyba ^^


(batmomobil) #6

Może tak:

logo.png[/code]


(tndek) #7

Bez zmian - pojawia się tylko napis, który jest odnośnikiem do strony.


(kostek135) #8

Najprosciej byłoby javascriptem, zdarzenie onclick i to co ma zrobić przy kliknięciu, czyli jakiś window.location = "http://www.google.com/" powiedzmy.


(Damgora) #9
a#naglowek {

height:120px;

background: url(img/logo.png);

display:block;

}

(manieKMP) #10

Prościej się chyba nie da :wink:

[/code]

PS. Żeby nie było, że nie dopowiedziałem, hash podmieniasz urlem

PPS. Dla identyfikatora w podanym kodzie css pozostaje tylko wysokość, reszta nie jest potrzebna.

PPPS. W css'ie klasa określana jest kropką, hash z podanego kodu wskazuje na identyfikator.


(tndek) #11

Praktycznie bez zmian, jednak tym razem pojawiła się ramka z pustym tłem i ikonką, co sugeruję niemożność załadowania obrazka. Poza tym w dalszym ciągu znajduje się logo jako tło, jednak nie zmienia się w odnośnik.


(manieKMP) #12

Pokaż tą część kodu html, w którym znajduje się/ma się znajdować logo, najlepiej cały box*, w którym chcesz je umieścić i zastosowany doctype.

U mnie podane rozwiązanie działa normalnie w "brudnopisie" i obrazek jest działającym linkiem. U Ciebie najwyraźniej występuje jakiś konflikt lub błąd w kodzie, o którym nie wiem.

* zbiór elementów, np. div'ów znajdujących się w div'ie:

Przykład

[Logo](img/logo.jpg)
[/code]

PS. Obrazek znajduje się w odpowiednim miejscu/katalogu i czy zachowane są wielkości liter.