Heim >Web-Frontend >js-Tutorial >jQuery implementiert den Tab-Wechsel mit ein paar Zeilen code_jquery

jQuery implementiert den Tab-Wechsel mit ein paar Zeilen code_jquery

WBOY
WBOYOriginal
2016-05-16 16:10:251195Durchsuche

Heute hatte ich plötzlich eine Laune und dachte über eine ganz einfache Möglichkeit nach, den Tab-Effekt zu erzielen

Tatsächlich ist die Logik sehr einfach, aber im Internet ist sie grundsätzlich nicht so geschrieben

Ich weiß nicht, ob es bei der tatsächlichen Anwendung zu Problemen kommen wird, bitte geben Sie mir einen Rat

Code kopieren Der Code lautet wie folgt:





jQuery Simple Tab

*{ margin:0; padding:0;}
Körper, ul, li {
Marge:0;
​ Polsterung:0;
}
Körper {
Schriftart: 12px/1,5 Tahoma;
}
#außen {
Breite:450px;
Rand: 10 Pixel automatisch;
}
#tab {
Überlauf:versteckt;
Zoom:1;
Hintergrund:#000;
Rand: 1 Pixel durchgehend #000;
}
#tab li {
float:left;
Farbe:#fff;
Höhe:30px;
Cursor:Zeiger;
Zeilenhöhe:30px;
Listenstiltyp:none;
Polsterung:0 20px;
}
#tab li.current {
Farbe:#000;
Hintergrund:#ccc;
}
#Inhalt {
Rand: 1 Pixel durchgehend #000;
Border-top-width:0;
}
#content ul {
Zeilenhöhe:25px;
Anzeige:keine;
Rand:0 30px;
Polsterung:10px 0;
}





                                                                                                                                                                                                                               


         

    1111
                                                                                                                                                                                          2222
                                                                                                                                                                            3333