Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Zmiana buttonów
Forum PHP.pl > Forum > Przedszkole
banite
Witam ponownie. Przepraszam że zakładam podobny temat ale tamten umarł śmiercią naturalną więc edit by go nie uratował [a nie sprecyzowałem problemu].
Chciałbym aby moje menu składało się wyłącznie z buttonów oraz listy blokowej. Wszystko jest ok gdy w liście występują jakieś wyrazy [np. Newsy, Archiwum itd.], gdy je usuwam wtedy nie ma żadnego odnośnika [teoretycznie jako newbie mógłbym wrzucić tam mało widoczną kropeczkę w kolorze background].
Gdy zamiast "Newsy" w linijce
<li><a href="index.html">Kontakt</a></li>
wstawiam <li><a href="index.html"><img src="button1.gif></a></li> <- możliwe że to teraz źle napisałem bo pisze w z głowy
wtedy gdy najadę kursorem na link nic się nie dzieje, gdy w innych wierszach które nie były zmieniane jest wszystko ok. Do tego widzę że jak klikne w ten link to takjakby niewidzialny obrazek robi się pod tym buttonem gdy nie wstawie
background: url("button1.gif") no-repeat right top;}
Wie ktoś jak to zrobić?
Możliwe że chaotycznie to napisałem, ale to z powodu tego że siedzę w tym od 2 dni.

edit: można by rzec że w styl.css chciałbym mieć każdy button inny [chcę zrobić każdy button z inną animacją i oczywiście innym napisem np. newsy, archiwum itd].
kantek
Trochę chaotycznie na drugi raz daj trochę html i css jak to wyglada.
Nie wiem czy Cię dobrze zrozumiałem
ja bym zrobił tak:


upewnij się że ścieżka do obrazka jest ok
  1. <?php
  2. <div class="menu">  
  3.        <ul>  
  4.                <li><a href=""><img src="folder_z_graifka/obrazek.jpg" border="0" /></a></li>
  5.                ...
  6.         </ul>  
  7. </div>
  8. ?>

a w css - wartości px oczywiście dajesz swoje
ustawiamy sobie diva menu (display:inline; eliminacja buga w ie6)
  1. <?php
  2. .menu
  3. {
  4. margin:0px;
  5. padding:0px;
  6. width:260px;
  7. display:inline;
  8. float:left;
  9. }
  10. ?>


(ustawienia dla listy i linków w divie klasy menu)
lista
  1. <?php
  2. .menu ul
  3. {
  4. list-style-type:none;
  5. line-height:40px;
  6. float:left;
  7. }
  8. ?>

elementy listy w pionie + jakiś kolor tła (taki jak linków), linki wyśrodkowane
  1. <?php
  2. .menu li
  3. {
  4. text-align:center;
  5. background-color:#424242;
  6. }
  7. ?>


ustawienia linka
  1. <?php
  2. .menu a
  3. {
  4. display:block;
  5. height:40px;
  6. width:260px;
  7. outline:0;
  8. }
  9. ?>

jakas zmiana po najechaniu - u mnie przezroczystość
  1. <?php
  2. .menu a:hover
  3. {
  4. opacity: 0.60;          
  5. filter: alpha(opacity=60);
  6. -moz-opacity: 0.60;
  7. height:40px;
  8. width:260px;
  9. }
  10. ?>


Mam nadzieję że Ci pomogłem, a jak nie to może komuś się to przyda smile.gif

Pozdrawiam
bluesqad
style css sie klaniaja a konkretnie znacznik A czyli ten od linka
a:link
a:hover
a:visited...

no i do nich klasy albo identyfikatory jesli chcesz miec każdy inny.
banite
Drogi Kantku, a czemuż to te wszystkie linijki formułujesz w php?
kantek
Buttony do edycji postu u mnie nie zdiałają :/
muszę wpisywać ręcznie nawias_kwadratowy html / nawias_kwadratowy

Starałem się skupiać na treści (może głupi nawyk z tym php),
ale rzeczywiście dla początkujących może być to mylące.

Będę używał więc
  1. tagów dla htmla


Pozdrawiam
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.