www.MegaLab.it

da **kakhaber78** » lun ago 13, 2007 2:18 pm

SAlve ragazzi volevo sapere se nessuno ha idea come creare ed inserire un menu a tendina in un sito con stile css? io ho trovato un sito che me lo crea ma non idea dove inserirlo io vi do i miei parametri se potete aiutarmi mi fate un favorone:
Qui sotto i parametri del mio style css:
/* +++++++++++++++++++++++++++++ Shifting Ground +++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++ Common Styles ++++++++++++++++++++ */

* {
margin: 0px;
padding: 0px;
}

body {
color: #fff;
background-color: #666666;
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 100%;
text-align: center;
}

table {
font-size: 1em;
}

td {
color: #fff;
background-color: inherit;
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 1em;
}

a {
color: #fff;
background-color: inherit;
text-decoration: underline;
}

a:hover {
color: #fff;
background-color: inherit;
text-decoration: none;
}

img {
border: none;
}

ul, ul li {
list-style: none outside;
}

ol, ol li {
list-style: decimal inside;
}

p {
padding: 0.6em 0em 0.6em;
}

fieldset {
border: none;
}

input, textarea, select {
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 13px;
}

.hidethis {
display: none;
}

.clearthis {
margin : 0px;
height : 1px;
clear : both;
float : none;
font-size: 1px;
overflow : hidden;
visibility: hidden;
}

/* ++++++++++++++++++++ Image Thumbnails ++++++++++++++++++++ */

.tb_center {
text-align: center;
}

.tb_center img {
margin: 1.3em auto;
border: 1px #fff solid;
}

/* ++++++++++++++++++++ Body Wrappers ++++++++++++++++++++ */

#body_wrapper {
margin: auto;
width: 982px;
background: url('images/rightcol_img.png') no-repeat 100% 68px;
font-size: 0.71em;
}

/* ++++++++++++++++++++ Body Container ++++++++++++++++++++ */

#body_container {
float: right;
position: relative;
left: -243px;
width: 496px;
background: url('images/main_bg_bot.gif') no-repeat 0% 100%;
}

#body_container_b {
padding: 15px 0px;
width: 496px;
background: url('images/main_bg_top.gif') no-repeat 0% 0%;
}

#body_container_c {
color: inherit;
background-color: #008000;
border-left: #fff 6px solid;
border-right: #fff 6px solid;
}

/* ++++++++++++++++++++ Page Header ++++++++++++++++++++ */

#page_header {
padding-bottom: 2px;
color: inherit;
background-color: #FFFFFF;
}

#page_header h1 {
position: relative;
top: -4px;
width: 100%;
height: 40px;
background: url('images/counterstrike_logo.gif') no-repeat 50% 50%;
}

/* ++++++++++++++++++++ Page Content ++++++++++++++++++++ */

#page_content {
padding: 15px 17px 10px;
font-weight: bold;
text-align: left;
}

.link_readmore {
padding: 35px 0px 10px;
text-align: right;
}

.link_readmore a {
margin-left: auto;
display: block;
width: 94px;
height: 24px;
background: url('images/button_readmore.gif') no-repeat 0% 0%;
}

/* ++++++++++++++++++++ Navigation Menu ++++++++++++++++++++ */

#navmenu {
float: left;
margin-top: 68px;
position: relative;
left: 77px;
width: 166px;
background: url('images/navmenu_bg_bot.gif') no-repeat 0% 100%;
font-size: 1.15em;
font-weight: bold;
}

#navmenu_b {
padding: 15px 0px;
width: 166px;
background: url('images/navmenu_bg_top.gif') no-repeat 0% 0%;
}

#navmenu_c {
color: inherit;
background-color: #008000;
border-left: #fff 6px solid;
}

#navmenu a {
text-decoration: none;
text-transform: uppercase;
}

#navmenu li {
border-top: #fff 1px solid;
}

#navmenu li a {
display: block;
padding: 5px 0px;
width: 160px;
}

#navmenu li a:hover {
color: inherit;
background-color: #FF00FF
}

#navmenu li.list_first {
border-top: none;
}

/* ++++++++++++++++++++ Page Footer ++++++++++++++++++++ */

#page_footer {
padding: 20px 0px;
font-size: 0.9em;
font-weight: bold;
}

e qui vi do cio che mi da sto sito da INSERIRE MA IO NON HO IDEA DI COME INSERIRLO:
.buttonscontainer {width: 90px;}

.buttons a {color: #FFFFFF;
border: 1px solid;
background-color: #009900;
padding: 2px;
padding-left: 3px;
font: 13px Tahoma, sans-serif;
font-weight: bold;
text-decoration: none;
border-color: #66CC00 #006600 #006600 #66CC00;
display: block;
margin: 0px;
width: 100%;
text-align: left;}

.buttons a:hover {border: 1px solid;
padding-left: 4px;
padding-top: 3px;
padding-bottom: 1px;
padding-right: 1px;
background-color: #009900;
border-color: #006600 #66CC00 #66CC00 #006600;
color: #000000;
text-decoration: none;}

aIUTATEMI PLEASE [rotfl]

da **M@ttia** » lun ago 13, 2007 3:59 pm

Lo puoi inserire tranquillamente nel (foglio di) CSS dove vuoi, ad es. dopo l'ultimo #pagefooter [^]

da **kakhaber78** » lun ago 13, 2007 4:06 pm

ma devo metterci niente prima o dopo ?
Cosi perciò mi diventerebbe:
/* +++++++++++++++++++++++++++++ Shifting Ground +++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++ Common Styles ++++++++++++++++++++ */

* {
margin: 0px;
padding: 0px;
}

body {
color: #fff;
background-color: #666666;
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 100%;
text-align: center;
}

table {
font-size: 1em;
}

td {
color: #fff;
background-color: inherit;
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 1em;
}

a {
color: #fff;
background-color: inherit;
text-decoration: underline;
}

a:hover {
color: #fff;
background-color: inherit;
text-decoration: none;
}

img {
border: none;
}

ul, ul li {
list-style: none outside;
}

ol, ol li {
list-style: decimal inside;
}

p {
padding: 0.6em 0em 0.6em;
}

fieldset {
border: none;
}

input, textarea, select {
font-family: 'verdana', 'helvetica', sans-serif;
font-size: 13px;
}

.hidethis {
display: none;
}

.clearthis {
margin : 0px;
height : 1px;
clear : both;
float : none;
font-size: 1px;
overflow : hidden;
visibility: hidden;
}

/* ++++++++++++++++++++ Image Thumbnails ++++++++++++++++++++ */

.tb_center {
text-align: center;
}

.tb_center img {
margin: 1.3em auto;
border: 1px #fff solid;
}

/* ++++++++++++++++++++ Body Wrappers ++++++++++++++++++++ */

#body_wrapper {
margin: auto;
width: 982px;
background: url('images/rightcol_img.png') no-repeat 100% 68px;
font-size: 0.71em;
}

/* ++++++++++++++++++++ Body Container ++++++++++++++++++++ */

#body_container {
float: right;
position: relative;
left: -243px;
width: 496px;
background: url('images/main_bg_bot.gif') no-repeat 0% 100%;
}

#body_container_b {
padding: 15px 0px;
width: 496px;
background: url('images/main_bg_top.gif') no-repeat 0% 0%;
}

#body_container_c {
color: inherit;
background-color: #008000;
border-left: #fff 6px solid;
border-right: #fff 6px solid;
}

/* ++++++++++++++++++++ Page Header ++++++++++++++++++++ */

#page_header {
padding-bottom: 2px;
color: inherit;
background-color: #FFFFFF;
}

#page_header h1 {
position: relative;
top: -4px;
width: 100%;
height: 40px;
background: url('images/counterstrike_logo.gif') no-repeat 50% 50%;
}

/* ++++++++++++++++++++ Page Content ++++++++++++++++++++ */

#page_content {
padding: 15px 17px 10px;
font-weight: bold;
text-align: left;
}

.link_readmore {
padding: 35px 0px 10px;
text-align: right;
}

.link_readmore a {
margin-left: auto;
display: block;
width: 94px;
height: 24px;
background: url('images/button_readmore.gif') no-repeat 0% 0%;
}

/* ++++++++++++++++++++ Navigation Menu ++++++++++++++++++++ */

#navmenu {
float: left;
margin-top: 68px;
position: relative;
left: 77px;
width: 166px;
background: url('images/navmenu_bg_bot.gif') no-repeat 0% 100%;
font-size: 1.15em;
font-weight: bold;
}

#navmenu_b {
padding: 15px 0px;
width: 166px;
background: url('images/navmenu_bg_top.gif') no-repeat 0% 0%;
}

#navmenu_c {
color: inherit;
background-color: #008000;
border-left: #fff 6px solid;
}

#navmenu a {
text-decoration: none;
text-transform: uppercase;
}

#navmenu li {
border-top: #fff 1px solid;
}

#navmenu li a {
display: block;
padding: 5px 0px;
width: 160px;
}

#navmenu li a:hover {
color: inherit;
background-color: #FF00FF
}

#navmenu li.list_first {
border-top: none;
}

/* ++++++++++++++++++++ Page Footer ++++++++++++++++++++ */

#page_footer {
padding: 20px 0px;
font-size: 0.9em;
font-weight: bold;
}
.buttons a {color: #FFFFFF;
border: 1px solid;
background-color: #009900;
padding: 2px;
padding-left: 3px;
font: 13px Tahoma, sans-serif;
font-weight: bold;
text-decoration: none;
border-color: #66CC00 #006600 #006600 #66CC00;
display: block;
margin: 0px;
width: 100%;
text-align: left;}

.buttons a:hover {border: 1px solid;
padding-left: 4px;
padding-top: 3px;
padding-bottom: 1px;
padding-right: 1px;
background-color: #009900;
border-color: #006600 #66CC00 #66CC00 #006600;
color: #000000;
text-decoration: none;}

da **kakhaber78** » lun ago 13, 2007 4:28 pm

ok fatto, questo è venuto

da **M@ttia** » lun ago 13, 2007 4:34 pm

Sì esatto, semplicemente tu definisci dei "nomi" con

#Nome { Vari parametri }
.Nome { Vari parametri }

(con la # è un id unico, ma a te non interessa), mentre tutto quello fra /* ... */ sono solo dei commenti per gli "umani", che puoi anche cancellare se non li vuoi.

L'ordine con cui dichiari questi "nomi" è indifferente, basta che ci siano quando lui li viene a cercare... [^]

da **kakhaber78** » lun ago 13, 2007 4:53 pm

il sito creato da me è questo: ww.macho77.altervista.org
però a me piacerebbe avere quel menù con dei sotto menu a ppena clicco per dire su un bottone mi esce un altro menù, ma non idea di come inserirlo farlo senza l uso di java(che poi so riuscito solo tramite un programma ma chje era in prova).. tum i sai consigliare qualcosa dove andare a leggere

www.MegaLab.it

CSS AIUTO

CSS AIUTO

Chi c’è in linea