2. Property background="URL" - ställer in bakgrundsbilden. Istället för URL:en ska adressen till bakgrundsbilden skrivas.

Exempel

Exempeltabell

Kolumn 1

Kolumn 2

Konverterar till följande på sidan:

I exemplet ovan finns vår bakgrundsbild i img-mappen (som finns i samma katalog som html-sidan), och bilden heter fon.gif. Observera att i taggen har vi lagt till style="color:white;" . Eftersom bakgrunden är nästan svart gjorde vi texten vit för att förhindra att texten smälter in i bakgrunden.

3. Egenskap bgcolor="color" - ställer in bakgrundsfärgen för tabellen. Du kan välja vilken färg som helst från hela paletten (se koder och namn på html-färger)

4. Property border="number" - ställer in tjockleken på bordskanten. I tidigare exempel angav vi border="1" , vilket betyder att kanttjockleken är 1 pixel.

5. Egenskap bordercolor="color" - ställer in färgen på kanten. Om border="0" kommer det inte att finnas någon kant och kantfärgen kommer inte att ha någon betydelse.

6. Egenskap cellpadding="number" - indrag från ramen till cellinnehållet i pixlar.

7. Egenskap cellspacing="number" - avståndet mellan celler i pixlar.

8. Egenskap cols="number" - antalet kolumner. Om du inte ställer in det kommer webbläsaren själv att avgöra antalet kolumner. Den enda skillnaden är att specificering av denna parameter med största sannolikhet kommer att påskynda laddningen av tabellen.

9. Property frame="parameter" - hur man visar kanter runt bordet. Kan ta följande värden:

• void - rita inte gränser
• bård - bård runt bordet
• ovan - kant längs bordets övre kant
• nedan - kant längst ner i tabellen
• hsides - lägg bara till horisontella kanter (överst och nederkant av tabellen)
• vsides - rita endast vertikala kanter (till vänster och höger om tabellen)
• rhs - kant bara på höger sida av bordet
• lhs - kant endast på vänster sida av bordet

10. Property height="number" - ställer in tabellens höjd: antingen i pixlar eller i procent.

11. Egenskapsregler="parameter" - var gränser mellan celler ska visas. Kan ta följande värden:

• alla - en linje dras runt varje tabellcell
• grupper - en rad visas mellan grupper som bildas av taggar

Attribut och egenskaper

1. Egenskap align="parameter" - ställer in justeringen av en enskild tabellcell. Kan ta följande värden:

• vänster - vänster justering
• center - center alignment
• höger - höger uppriktning

2. Egenskap background="URL" - ställer in bakgrundsbilden för cellen. Istället för URL:en ska adressen till bakgrundsbilden skrivas.

3. Egenskap bgcolor="color" - ställer in cellens bakgrundsfärg.

4. Egenskap bordercolor="color" - ställer in färgen på cellkanten.

5. Egenskapen char="letter" - anger bokstaven från vilken justeringen ska göras. Värdet för align-attributet måste ställas in på char.

6. Egenskap colspan="number" - ställer in antalet horisontella celler som ska slås samman.

7. Egenskap height="number" - ställer in höjden på tabellen: antingen i pixlar eller i procent.

8. Property width="number" - ställer in tabellens bredd: antingen i pixlar eller i procent.

9. Egenskap rowspan="number" - ställer in antalet vertikala celler som ska slås samman.

10. Egenskap valign="parameter" - vertikal justering av cellinnehållet.

• topp - justera cellinnehållet till radens övre kant
• mitten - mitten inriktning
• botten - anpassning till den nedre kanten
• baslinje - anpassning till baslinjen

För tagg

Hur man förhindrar att cellkanter i en tabell klibbar ihop

Om du använder en kantlinje (cellkant) och noll utfyllnad mellan celler, sitter de fortfarande ihop och du får en dubbel kant . För att undvika detta måste du ange border-collapse: collapse i tabellstilarna:

...

Kära läsare, nu har du lärt dig mycket mer om html-tabelltaggen. Nu råder jag dig att gå vidare till nästa lektion.

Den här föreläsningen diskuterar i detalj principerna för att använda tabeller i HTML-uppmärkning. Detta inkluderar en tabellformad organisation av text, ett tabellformigt koordinatnät och grafik organiserad i tabeller.

Verktyg för att beskriva tabeller i HTML

När WWW utvecklades blev det tydligt att resurserna i HTML inte räckte till för högkvalitativ visning av olika typer av dokument. Nackdelen med HTML var bristen på verktyg för att visa tabeller. För detta ändamål, förformaterad text (tag

), där tabellen var skisserad med ASCII-tecken.  Men denna form av bordspresentation räckte inte Hög kvalitet och skilde sig från dokumentets allmänna stil.  Efter introduktionen av tabeller i HTML hade webbansvariga inte bara ett verktyg för att placera text och numerisk data, utan ett kraftfullt designverktyg för att placera grafiska bilder och text på rätt plats på skärmen.

Skapa tabeller i HTML
Taggen används för att beskriva tabeller<ТАВLЕ>.  Märka<ТАВLЕ>, som många andra, översätter automatiskt raden före och efter tabellen.
Skapa en tabellrad - tagg<ТR>
Märka<ТR>(Tabellrad) skapar en tabellrad.  All text, andra taggar och attribut som behöver placeras på en rad måste placeras mellan lt;TR>-taggarna.
Definiera tabellceller - tagg<ТD>
Celler med data placeras vanligtvis i en tabellrad.  Varje cell som innehåller text eller bild måste omges av taggar<ТD>.  Antal taggar<ТD>i rad definierar antalet celler

 

 
Tabell
 
 

Om en tabell har två TR-taggar, har den två rader.
Om det finns tre TD-taggar på en rad,	sedan i den	tre kolumner.

Tabellkolumnrubriker - tagg<ТН>

Rubriker för tabellkolumner och rader ställs in med hjälp av header-taggen<ТН>(TableHeader, tabelltitel). Dessa taggar liknar varandra<ТD>. Skillnaden är att texten är innesluten mellan taggarna<ТН>, skrivs automatiskt i fet stil och placeras som standard i mitten av cellen. Du kan avcentrera texten och justera texten till vänster eller höger. Om du använder<ТD>med tagg<В>och attribut<АLIGN=center>, kommer texten också att se ut som en titel. Tänk dock på att inte alla webbläsare stöder fetstil i tabeller, så det är bättre att ställa in tabellrubriker med<ТН>.

Rubriken är centrerad som standard	Rubriken kan sammanfoga kolumner
Rubriken kan placeras före kolumnerna	Text eller data	Text eller data
Rubrik kan sammanfoga rader	Text eller data	Text eller data
	Text eller data	Text eller data
	Text eller data	Text eller data

Använda tabellrubriker - tagg<САРТIОN>

Märka

Låt oss öppna vår webbsida fil index.html för redigering med Notepad++. Och öppna den med en webbläsare för att se ändringarna på sidan.

I början av den här artikeln pratade vi om det faktum att webbplatslayouten som vi har planerat är en tabell.

Dessutom kommer vår webbplatslayouttabell att bestå av tre rader (Heder, Content och Footer) och två kolumner (Meny och Content).

För att lägga till en tabell med tre rader och två kolumner, låt oss ändra vår kod för att lägga till följande:

För att ställa in en kantlinje i tabellen, använd kantparametern. Tjockleken på tabellkanten anges i pixlar (px).

Låt oss lägga till en kantparameter till vår html-kod, med ett argumentvärde lika med 1px. Det vill säga, tjockleken på bordsramen kommer att vara lika med en pixel:

För att justera tabellen i mitten av webbläsarfönstret använder vi parametern align, som kan ha tre värden: vänster, mitten, höger. Det är tydligt att för att justera tabellen i mitten av webbläsarfönstret, värdet på alignment parameter argument måste vara lika med: center.

Och låt oss ställa in bredden på bordet här. Tabellens bredd anges av parametern width. Värdena som denna parameter kan ta kan uttryckas som ett heltal i pixlar eller som en procentandel av det aktuella webbläsarfönstrets bredd.

Låt oss lägga till justering och tabellbredd till vår kod, och som ett resultat får vi följande kod:

Vi uppdaterar webbläsarfönstret på vår webbsida för att se ändringarna, vi ser att tabellen har justerats mot mitten av fönstret och har ändrat dess bredd.

Låt oss nu gå tillbaka till tabellramen, i html-koden ställer vi in ​​den till 1 pixel med värdet av gränsparameterargumentet: border=”1”.

Se parametrarna för TABLE-taggen i html-referensboken; det finns två parametrar här som påverkar utseende ramverk.

Den första parametern: cellmellanrum – ställer in avståndet mellan tabellceller.

Andra parametern: cellpadding – avståndet från ramen till innehållet i cellen beror på värdet på argumentet för denna parameter.

För att göra alla avstånd och indrag minimala ställer vi in ​​värdena för argumenten ovanför ovanstående parametrar till noll.

Som ett resultat kommer html-koden för tabellen att ha följande form:

Som du kommer ihåg bör vår tabell ha tre rader, och den första raden ska ha en cell, den andra raden ska ha två celler och den tredje raden ska också ha en cell.

Om vi ​​tittar på tabellens utseende kommer vi att se att för att få tabellen till önskad form behöver vi bara kombinera de horisontella cellerna i den första och tredje raden.

För att göra detta kommer vi att använda parametern colspan. Denna parameter används i TD-taggen. Värdet för parameterargumentet colspan indikerar antalet horisontella celler som ska slås samman; i vårt fall är detta värde 2.

Förutom att lägga till parametern colspan, låt oss ändra etiketterna i tabellcellerna så att de matchar vår layout.

Efter alla ändringar kommer den fullständiga html-koden för vår sida att vara som följer:

Låt oss spara vår kod i Anteckningar och uppdatera filen index.html i webbläsaren för att se ändringarna.

Så den här lektionen visade sig vara ganska stor, så låt oss fortsätta att arbeta med html-tabellen på vår sida i nästa lektion.

Tabeller i HTML är så funktionella att du kan använda dem för att layouta hela webbplatser (läs). Nu kommer vi att prata om att infoga enkla HTML-tabeller på en webbsida, analysera bara markeringen, men inte röra designen, eftersom det är bättre att dekorera tabeller med CSS-stilar.

Tabelltaggar och attribut

Här är de grundläggande elementen du behöver för att skapa tabeller:

• - en behållare i vilken bordet är placerat (samma som
  för markerade eller
  för numrerade listor).
  1. gräns- ett attribut som bestämmer ramarnas tjocklek. Det är bättre att använda egenskapen border CSS istället.

  anger tabellens signatur. Du behöver inte använda en behållare, men om du ändå bestämmer dig för att namnge tabellen, placera den omedelbart efter taggen , utanför celler och rader.

  - en parad tagg som innehåller en tabellrad (celler placerade på samma horisontella nivå).

  , kommer det att finnas så många celler i den: en tagg - en cell.

  låter dig gruppera kolumner, snabbt och utan att täppa till koden, tilldela dem gemensamma egenskaper. Med hjälp av en behållare kan du separera de logiska delarna av en tabell från varandra. Placeras efter taggen

  , om det inte är där, sedan efter .

  används för samma ändamål som . kan innehålla , men inte vice versa.

  spänna- ett attribut som anger antalet kolumner som behållaregenskaperna tillämpas på

  .

  , Och - behållare som låter dig dela upp bordet i de övre (rubrikerna), huvuddelen (kroppen) respektive nedre (slutliga). I en HTML-tabell är sekvensen av dessa taggar densamma som sekvensen av behållare , Och

  Verktyg för att skapa webbplatser

  Syfte	Verktyg
Märkning	HTML	XHTML
Dekor	CSS
Utveckling	PHP	Pytonorm

  I webbläsaren kommer dokumentet att se ut så här:

  Låt oss ta reda på vilka rader kod som är ansvariga för vad.

  • - öppnade bordet och gav det tjockleken på ramarna.
    - de gav den titeln.
    - öppnade linjen.
    - skapade en cell med en rubrikdesign.
    - skapade en andra rubrikcell i raden. Colspan-parametern indikerade att denna cell skulle sträcka sig över två horisontellt.
    - stängde linjen. De återstående linjerna skapades på samma sätt.
    - lade till en andra rad i tabellen med vanliga celler istället för rubriker. Efterföljande rader och celler infogades på liknande sätt.

    Verktyg för att skapa webbplatser

    Syfte	Verktyg
  Märkning	HTML	XHTML

    - stängde bordet.

  Populär i kategorin:

  Handlingsplan för att sätta upp en terminal från Sberbank - zolnirt -...

  läsa

  Programvara för att arbeta med KKM stroke-m

  läsa

  Installera Microsoft Office på en Windows-dator

  läsa

  Vad är DVDRip, CAMRip, TS, TC, DVDSrc, etc.

  läsa

  

  Senaste artiklarna

  Ava i kontakt: vad är det? Vad är awk? Hur...

  läsa

  Marknadskapacitet: vad är det och hur är det...

  läsa

  Efterlängtade belöningar för gamla världsspelare...

  läsa

  Wifi Analyzer är en applikation för att analysera WiFi...

  läsa

  Fem anledningar till att inte slänga din gamla hårddisk

  läsa

  VirusTotal: Virussökning online...

  läsa

  Hur man förbjuder betalabonnemang från operatörer...

  läsa

  Sätt att sätta in pengar på Skype Ladda upp...

  läsa

  vsevolozk.ru
  Vi studerar datorer - Windows, virus, program, reparationer, dataåterställning

  • Projektupplaga
  • Annonsering på hemsidan

  • Kontakter
  • Webbplatskarta

  © 2023 Studerar PC - Windows, virus, program, reparation, dataåterställning

  Topp

  - en tagg som skapar en tabellrubrikcell. Externt skiljer sig dess innehåll från innehållet i andra celler - vanligtvis texten inuti	Webbläsaren markerar den med fet stil och placerar den i mitten.	- en behållare med vilken en enkel cell skapas. Hur många sådana taggar kommer en rad att innehålla (tag