Många ny layout, bara komma till hjärtat att skapa webbplatser, ofta undrar hur man html för att göra bakgrundsbilden.Och om vissa av dem kan ta itu med detta problem, du fortfarande har problem under sträckan hela bredden av bilden på skärmen.Samtidigt skulle jag vilja se platsen visas på alla webbläsare, så det måste uppfylla kraven krossbrauzernosti.Du kan ställa in en bakgrundsbild på två sätt: genom att använda HTML-taggar och CSS-format.Var och en för sig själv väljer det bästa alternativet.Naturligtvis är CSS stil mycket mer praktiskt, eftersom koden är lagrad i en separat fil och tar inte upp extra högtalare i huvudsajten taggar, men först överväga en enkel metod för att ställa in bakgrundsbilden på webbplatsen.
grundläggande HTML-taggar för att skapa bakgrunden
Så gå till frågan om hur man gör en bakgrundsbild till html på skärmen.För att se vacker plats, måste du förstå en ganska viktig detalj: det är nog bara att göra en gradient bakgrund eller en färg för att måla det, men om du vill infoga bilden i bakgrunden, kommer det inte sträcka hela bredden på skärmen.Bilden var ursprungligen nödvändigt att plocka upp eller gör din egen design med denna förlängning, där du kommer att visa sidan.Först när bakgrundsbilden är klar, flytta den till en mapp som heter «Bilder».I den kommer vi att lagra alla de använda bilder, animationer och andra bildfiler.Denna mapp ska vara i rotkatalogen på filen med alla dina html.Nu kan du gå vidare till koden.Det finns flera alternativ för inspelning kod genom vilken mönstret kommer att förändras bilden.
- skrivattribut taggen.
- via CSS-format i HTML-koden.
- Skriv CSS stil i en separat fil.
Hur HTML för att göra bakgrundsbilden, för dig att avgöra, men jag skulle vilja säga några ord om hur det skulle vara det mest optimala.Den första metoden är genom att skriva genom en tagg har länge varit föråldrad.Det andra alternativet används mycket sällan, eftersom det visar sig att en hel del av samma kod.Ett tredje alternativ är den vanligaste och effektiva.Här är HTML tag exempel:
- första metoden för inspelning genom en tagg (kroppen) i filen index.htm.Det är skrivet i denna form: (kropps bakgrund = "Nazvanie_papki / Nazvanie_kartinki.rasshirenie") (/ body).Det är, om vi har en bild med namnet «Bild» och utvidgning JPG, och mappen vi heter «Bilder», då rekordet av HTML-kod skulle se ut så här: (kropps bakgrund = "Bilder / Picture.jpg") ... (/ body).
- andra metoden innebär inspelning CSS, men är skriven i samma fil med namnet index.htm.(kropps style = "background: url (" ../ bilder / Picture.jpg ') ").
- Och den tredje metoden för inspelning görs i två filer.Dokumentet med namnet index.htm taggen (huvud) skrivs en sådan linje: (huvud) (link rel = "stylesheet" type = "text / css" href = "Put_k CSS_faylu") (/ huvud).En stil fil med namnet style.css redan skriver: body {bakgrund: url (bilder / Picture.jpg ")}.
Hur HTML för att göra bakgrundsbilden, diskuterade vi.Nu måste du räkna ut hur man sträcka ut bilden över bredden av hela skärmen.
metoder för att sträcka tapeten på bredden av fönstret
föreställa vår skärmen i procentandelar.Det visar sig att hela längden och bredden på skärmen kommer att vara 100% x 100%.Vi måste sträcka ut bilden till denna bredd.Lägg att spela in bilder i style.css filen linje som kommer att sträcka bilden till hela bredden och längden på bildskärmen.Som det står skrivet i CSS?Det är enkelt!
kropp
{
bakgrund: url (bilder / Picture.jpg)
bakgrund Storlek: 100%;/ * Detta inlägg är lämplig för de flesta moderna webbläsare * /
}
Så vi räknat ut hur man gör bilden bakgrunden till html på skärmen.Det är en metod för inspelning i filen index.htm.Även om denna metod och föråldrade, men för nybörjare är det nödvändigt att veta och förstå.Taggen (huvud) (stil) div {background-size: täcka;} (/ Style) (/ huvud), denna post innebär att vi avsätta en särskild enhet för bakgrunden, som kommer att placeras över hela bredden av fönstret.Vi har övervägt två sätt att göra sajten bakgrundsbilden html, är bilden sträcks till hela bredden på skärmen i någon av de moderna webbläsare.
Hur man gör en fast bakgrund
Om du bestämmer dig för att använda bilden som bakgrund framtiden för webbresurs, så du behöver bara veta hur man gör det fast, så att det inte sträcka i längd och inte förstöra det estetiska utseendet.Helt enkelt genom att använda HTML-kod för att registrera ett litet tillägg.Du måste style.css fil för att lägga en mening efter bakgrunden: url (bilder / Picture.jpg ') fast;eller i stället läggas till efter semikolon separat rad - läge: fast.Således kommer din tapet fastställas.Under rullning en innehållswebbplats, ser du att textraderna rör, men bakgrunden förblir på plats.Så du lärt dig att html för att göra bakgrundsbild, på flera sätt.
arbetar med tabeller i HTML
Många oerfarna webbutvecklare, inför tabeller och enheter ofta inte förstår hur man html för att göra tabellen bakgrundsbild.Liksom alla lag HTML och CSS-format, är språket i webbprogrammering ganska enkelt.Och lösningen på detta problem är att skriva ett par rader kod.Du bör redan vet att skriva en tabell med rader och kolumner, respektive, såsom indikeras av taggarna (TR) och (TD).För att göra bakgrunden av tabellen i form av bilder, är det nödvändigt att lägga till taggen (tabell), (tr) eller (td) en enkel fras med hänvisning till bilden: bakgrund = URL för bilden.För tydlighetens skull ger vi ett par exempel.
bord med bildens bakgrund i stället: HTML exempel
Rita en 2x3 bord och göra det bakgrundsbilden lagras i mappen "Bilder" (tabell bakgrund = "Bilder / Picture.jpg") (tr) (td)1 (/ td) (td) 2 (/ td) (td) 3) (/ td) (/ tr) (tr) (td) 4 (/ td) (td) 5 (/ td) (td) 6 (/ td) (/ tr) (/ table).Så vårt bord kommer att dras i bakgrunden på bilden.
Nu drar samma platta storlekarna 2x3, men infoga en bild i ett kolumnnummer 1, 4, 5 och 6. (tabell) (tr) (td bakgrund = "Bilder / Picture.jpg") 1 (/ td)(td) 2 (/ td) (td) 3 (/ td) (/ tr) (tr) (td bakgrund = "Bilder / Picture.jpg") 4 (/ td) (td bakgrund = "Bilder / Picture.jpg") 5 (/ td) (td bakgrund =" Bilder / Picture.jpg ") 6 (/ td) (/ TR) (/ table).Efter att ha sett kan se att bakgrunden visas endast i de celler, där vi har registrerat, men inte hela tabellen.
Cross-browser webbplats
Det finns en sådan sak som kompatibilitet med olika webbläsare webbresurs.Detta innebär att sidorna på webbplatsen kommer att vara lika väl visas i olika typer och versioner av webbläsare.Det bör vara HTML-koden och CSS för att anpassa stilen krävs av webbläsare.Dessutom, i den moderna eran av smarta telefoner, är många webbutvecklare försöker skapa webbplatser som är anpassade och en mobil version av en dator och utseende.
