phpBB2 by Przemo

RebeliaCS · **Pomógł:** 1 raz Posty: 50

Witam, chciał bym zastąpić to menu które mam w css:

Kod:

/* MENU */
.menu {
width: 1200px;
height: 45px;
background: #2362e0; /* Old browsers */
background: -moz-linear-gradient(top, #2362e0 0%, #004cff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2362e0), color-stop(100%,#004cff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #2362e0 0%,#004cff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #2362e0 0%,#004cff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #2362e0 0%,#004cff 100%); /* IE10+ */
background: linear-gradient(to bottom, #2362e0 0%,#004cff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2362e0', endColorstr='#004cff',GradientType=0 ); /* IE6-9 */
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
}

.menu ul {
list-style: none;
float: left;
margin: 0;
padding: 0;
width: 100%;
height: 50%;
}

.menu ul li {
float: left;
margin: 0 auto;
}

.menu ul li a {
font: 14px/45px 'Lato', sans-serif;
float: left;
padding: 0px 15px 0px 15px;
transition: 0.5s;
text-decoration: none;
font-weight:normal;
text-transform:uppercase;
color:#efefef;
}

.menu ul li a:hover {
color: #fff;
background-color: rgba(0, 0, 0, 0.4);
}

Obrazkiem o ten samej wielkości.
Menu można zobaczyć na forum cs-rebelia.pl
Zielone pod headerem.

Gadatliwa Kasia

kooza · **Pomógł:** 486 razy Posty: 2401

to zastępujesz klase .menu ul li a na tą:

Kod:

background: url('images/obrazek.png') no-repeat;
width: XXpx;
float: left;

Wysokości nie dodajesz bo jak ma być taka sama jak jest to zostaje przy 45px;

RebeliaCS · **Pomógł:** 1 raz Posty: 50

To nie działa...

kooza · **Pomógł:** 486 razy Posty: 2401

Zarzuć jeszcze kod html menu + obrazki ktore chcesz wrzucić w niego

RebeliaCS · **Pomógł:** 1 raz Posty: 50

Najgorsze jest to że to nie ja robiłem ten styl a go przerabiam i nie wiem gdzie szukać a osoba która go robiła mi nie pomoże ponieważ jemu nikt nie pomagał i on tez nikomu nie będzie pomagał...

kooza · **Pomógł:** 486 razy Posty: 2401

To załącz plik overall_header.tpl

RebeliaCS · **Pomógł:** 1 raz Posty: 50

Plik:

kooza · **Pomógł:** 486 razy Posty: 2401

dobra w css nic nie ruszaj.
w overall_header.tpl daje Ci przykład. Czyli znajdz:

Kod:

zamień na:

Kod:

Jak zrobisz sobie obrazki do menu, to tylko zmień odnośnik i reguluj szerokością 'width: 100px;'

RebeliaCS · **Pomógł:** 1 raz Posty: 50

Ja chcę zostawić menu, kurde nie zrozumiałeś mnie. Chcę zmienić tylko grafikę całego menu a reszta zostaje czyli zamiast jednolitego zielonego koloru chcę dać np. to:

Asus · **Pomógł:** 20 razy Posty: 83

Kod:

.menu {
background: url("http://webmasteruj.pl/upload/files/belka_4616.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
height: 45px;
width: 1200px;
}

kooza · **Pomógł:** 486 razy Posty: 2401

no właśnie źle Cię zrozumiałem to w .css menu znajdź:

Kod:

background: #248606; /* Old browsers */
background: -moz-linear-gradient(top, #248606 0%, #058905 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#248606), color-stop(100%,#058905)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #248606 0%,#058905 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #248606 0%,#058905 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #248606 0%,#058905 100%); /* IE10+ */
background: linear-gradient(to bottom, #248606 0%,#058905 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#248606', endColorstr='#058905',GradientType=0 ); /* IE6-9 */

i zamień na:

Kod:

background: url('http://webmasteruj.pl/upload/files/belka_4616.png') no-repeat;

obrazek wgraj sobie na serwer i zmień odnośnik

Gadatliwa Kasia

RebeliaCS · **Pomógł:** 1 raz Posty: 50

Dzięki, znów udowodniłeś że się na tym znasz! Teraz forum wygląda super. Jeszcze raz dzięki!
A jak bym chciał zmienić te zielone belki niżej?

//edit już sobie poradziłem w ten sam sposób tyle że zmieniłem ten kod na ten co mi napisałeś:

Kod:

background: #3d730e; /* Old browsers */
background: -moz-linear-gradient(top, #3d730e 0%, #3d730e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3d730e), color-stop(100%,#3d730e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #3d730e 0%,#3d730e 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #3d730e 0%,#3d730e 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #3d730e 0%,#3d730e 100%); /* IE10+ */
background: linear-gradient(to bottom, #3d730e 0%,#3d730e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d730e', endColorstr='#3d730e',GradientType=0 ); /* IE6-9 */