HTML -bordgrense

HTML -bordgrense
“En tabellgrense definerer grensene for en tabell utover som du ikke kan utvide denne tabellen. I HTML kan du lage forskjellige typer grenser for bordene dine for å få dem til å se mer fascinerende. I denne guiden vil vi lære deg det grunnleggende om å lage bordgrensene i HTML ved å gå deg gjennom noen få eksempler.”

Hvordan lage et bord med en grense i HTML?

Det er forskjellige typer bordgrenser som er tilgjengelige i HTML. Du kan bruke disse grensene i henhold til ditt eget valg. I de tre eksemplene som er oppført nedenfor, vil vi imidlertid dele med deg metodene for å lage tre av de mest brukte tabellgrensene i HTML.

Eksempel 1: Opprette en kollapset bordgrense

En kollapset bordgrense er den der grensene til alle cellene i en tabell kollapser og smelter sammen til en enkelt solid kant. I dette eksemplet vil vi vise deg hvordan du kan lage en kollapset bordgrense i HTML ved å bruke følgende HTML -skript:

I dette eksemplet har vi laget en tabell i HTML ved hjelp av tabellkoden. Vi har valgt en "1-piksel solid svart" grense for dette bordet, og vi har også valgt denne grensen til å bli kollapset, i.e., Alle cellene i tabellen vil ha samme grense. Deretter ønsket vi at denne tabellen skulle ha to forskjellige kolonner, nemlig "ansatt" og "betegnelse", og vi ønsket å ha postene til to forskjellige ansatte i denne tabellen. Derfor har vi nevnt navnene på de ansatte og deres respektive betegnelser innen separate “Tr” og “TD” -koder av HTML.

Da vi utførte ovennevnte HTML-skript, dukket vårt bord med kollapset grense opp på websiden, som vist på bildet nedenfor:

Eksempel 2: Opprette en usynlig bordgrense

En usynlig bordgrense er den der vi velger en bakgrunnsfarge for alle cellene i tabellen vår, samtidig. For å lage en slik tabell i HTML, må du bruke følgende HTML -skript:

I dette skriptet har vi satt vår tabellgrensefarge som hvit slik at det kan virke usynlig. Deretter har vi valgt tilfeldig bakgrunnsfarge for alle cellene i tabellen vår. Etter det brukte vi de samme tabelloppføringene som vi brukte i vårt første eksempel.

Da vi utførte dette HTML -skriptet, dukket vårt bord med en usynlig grense opp på websiden, som vist på bildet nedenfor:

Eksempel 3: Opprette en stiplet bordgrense

Som navnet sier, er en stiplet bordgrense en hvis grense er i form av prikker i stedet for å være solid. For å lage en slik tabell i HTML, må du henvise til følgende skript:

I dette eksempelet har vi valgt den stiplede grensestilen for vårt bord. Etter det er resten av tabelloppføringene nøyaktig de samme som vi har brukt i våre to første eksempler.

Ved utførelse ga dette HTML -skriptet en tabell med en stiplet kant på websiden, som vist på bildet nedenfor:

Konklusjon

Denne opplæringen ble opprettet for å demonstrere bruken og opprettelsen av bordgrenser i HTML. For å forklare det for deg i detalj, snakket vi om tre forskjellige typer bordgrenser i HTML. Du kan tydelig se virkningen av å endre grensestilen på det generelle utseendet på bordet ditt fra eksemplene vist ovenfor. Derfor, nå, kan du enkelt velge bordgrensen du liker best og lage den i løpet av sekunder. Dessuten kan du også utforske andre bordgrenser som er tilgjengelige i HTML på egen hånd.