Hvordan endre HTML Table størrelse med en mus

April 13

Styr bredden og høyden på bordene på dine websider med Cascading Style Sheet (CSS) kode, sette "bredde" og "høyde" egenskaper piksel eller prosentverdier. Legg bredde og / eller høyde egenskapene til tabellen: hover "pseudo-klasse for å endre sin størrelse når brukerens musemarkøren peker på dem For en side med flere tabeller du vil størrelsen annerledes, definere en klasse for hver, og erklærte den tilsvarende. "sveve" pseudo-klasser tilsvarende.

Bruksanvisning

1 Sett følgende CSS-kode mellom HEAD-kodene i HTML-dokument:

tabell: hover {

width: 100px;

height: 100px;

}

</ Style>

I stedet for 100px, kan du erstatte et beløp for "width" og "høyde" egenskaper for å angi størrelsen tabellen endres til når du holder markøren over det med musen.

2 Legg til ett eller flere tabeller til kroppen av HTML-dokumentet. For eksempel:

<Table>

</ Table>

3 Lagre siden og legg den i en nettleser. Flytt musepekeren over et bord; Størrelsen endringer i bredden og høyden du har angitt.

4 Definere egne klasser for tabeller du vil størrelsen annerledes. For eksempel endre CSS-koden til følgende, endre "width" og "høyde" egenskaper til størrelsene du ønsker:

.t1: hover {

width: 300px;

height: 300px;

}

.t2: hover {

width: 100px;

height: 100px;

}

</ Style>

Plasser følgende tabeller i kroppen, og bemerker at bruk av "klasse" egenskap for å skille dem:

</ Table>

</ Table>