CSS menu replace / help

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
Inprevious
Δημοσιεύσεις: 69
Εγγραφή: 05 Απρ 2010 02:56

CSS menu replace / help

Δημοσίευση από Inprevious » 08 Ιουν 2010 23:49

Παιδια εχω π.χ αυτο το μενu και 8ελω να το αλλαξω. δειτε λιγο


ΑΥΤΟ ΠΟΥ ΕΧΩ

Κώδικας: Επιλογή όλων



ul.menu li {
display:inline;
font-size:11px;
font-weight:bold;
line-height:50px;
}
ul.menu li.divider {
display:inline;
width:2px;
height:50px;
float:left;
background:url(images/menu_divider.gif) no-repeat center;
}

a.nav1:link, a.nav1:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/home.png) no-repeat left; color:#676d77;}
a.nav2:link, a.nav2:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/services.png) no-repeat left; color:#676d77;}
a.nav3:link, a.nav3:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/favs.png) no-repeat left; color:#676d77;}
a.nav4:link, a.nav4:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/user_add.png) no-repeat left; color:#676d77;}
a.nav5:link, a.nav5:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/car.png) no-repeat left; color:#676d77;}
a.nav6:link, a.nav6:visited {
display:block; float:left; padding:0px 8px 0px 22px; margin:0 14px 0 14px;height:50px;text-decoration:none; background:url(images/contact-new.png) no-repeat left; color:#676d77;}

a.nav1:hover, a.nav2:hover, a.nav3:hover, a.nav4:hover, a.nav5:hover, a.nav6:hover {
color:#333333;}


ΚΑΙ ΑΥΤΟ ΠΟΥ ΘΕΛΩ ΝΑ ΑΛΛΑΞΩ. ΔΗΛΑΔΗ ΝΑ ΓΙΝΕΙ ΕΤΣΙ


Κώδικας: Επιλογή όλων


ul.menu {
margin: 0;
padding: 0;
list-style: none;
float: left;
font-size: 1.1em;
}
ul.topnav li{
margin: 0;
padding: 0;
overflow: hidden; 
float: left;
height:38px;
}
ul.topnav a, ul#topnav span { 
padding: 10px 62px;
float: left;
text-decoration: none;
color: #fff;
background: url(a_bg.gif) repeat-x;
text-transform: uppercase;
clear: both;
width: 100%;
height: 19px;
line-height: 20px; 
}
ul.topnav a{ 
color: #555;
background-position: left bottom;
}
ul.topnav span
background-position: left top;
}



ΟΡΙΣΤΕ ΚΑΙ το script java που ειναι στο δευτερο στο HTML

Κώδικας: Επιλογή όλων


<script>
$&#40;document&#41;.ready&#40;function&#40;&#41; &#123;

$&#40;"#topnav li"&#41;.prepend&#40;"<span></span>"&#41;; 

$&#40;"#topnav li"&#41;.each&#40;function&#40;&#41; &#123; 
var linkText = $&#40;this&#41;.find&#40;"a"&#41;.html&#40;&#41;; 
$&#40;this&#41;.find&#40;"span"&#41;.show&#40;&#41;.html&#40;linkText&#41;; 
&#125;&#41;;

$&#40;"#topnav li"&#41;.hover&#40;function&#40;&#41; &#123; 
$&#40;this&#41;.find&#40;"span"&#41;.stop&#40;&#41;.animate&#40;&#123;
marginTop&#58; "-40" 
&#125;, 250&#41;;
&#125; , function&#40;&#41; &#123; 
$&#40;this&#41;.find&#40;"span"&#41;.stop&#40;&#41;.animate&#40;&#123;
marginTop&#58; "0"  
&#125;, 250&#41;;
&#125;&#41;;

&#125;&#41;;
</script>



το προσπαθησα κ τπτ.. θελω να πω πως το 1ο μενυ θελω να γινει σαν το 2ο. απλα τ θεμα ειναι οτι μ βγαινει αλλοπροσαλλο . βοηθηστε με αν μπορειτε

Άβαταρ μέλους
Inprevious
Δημοσιεύσεις: 69
Εγγραφή: 05 Απρ 2010 02:56

CSS menu replace / help

Δημοσίευση από Inprevious » 09 Ιουν 2010 00:24

παιδια βοηθηστε με αν μπορειτε γιατι ψιλο καιγομε (ευχαριστω εξαρχης παντως)

Άβαταρ μέλους
Inprevious
Δημοσιεύσεις: 69
Εγγραφή: 05 Απρ 2010 02:56

CSS menu replace / help

Δημοσίευση από Inprevious » 09 Ιουν 2010 18:13

Καποιος να βοηθησει?

Άβαταρ μέλους
Inprevious
Δημοσιεύσεις: 69
Εγγραφή: 05 Απρ 2010 02:56

CSS menu replace / help

Δημοσίευση από Inprevious » 09 Ιουν 2010 22:14

τιποτα?

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

CSS menu replace / help

Δημοσίευση από Basilakis » 10 Ιουν 2010 11:06

γράψε καμια 10αριά φορές ακόμη, κάτι μπορεί να γίνει :P

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες