I den här handledningen kommer vi att använda Notepad++-redigeraren för att skapa HTML- och CSS-filer, den är avsedd för användare Microsoft Windows och alla exempel kommer att utföras i den.
Om du har en Mac kan du köra exemplen i Brackets-redigeraren, precis som Anteckningar++ helt gratis. När det gäller redaktören Fästen, då är det lämpligt för användare Microsoft Windows, kan du sedan välja vad som ligger närmast dig.
Skapa en intern stilmall
Låt oss titta på ett exempel där du kommer att skapa din första interna stilmall.
Steg 1: Öppna en textredigerare
Tryck på WIN + R-knapparna samtidigt (analogt med Start - Kör) och en dialogruta öppnas "Sikt" enter och tryck på Enter (programmet öppnas ), eller kör programmet genom hennes genväg.
Huvudprogramfönstret öppnas framför dig:
Steg 2: Skapa en dokumentstruktur
Kopiera eller klistra in följande HTML-kod i redigeraren:
I exempelkoden för denna handledning kommer jag att ge ytterligare kommentarer, markerade i ljusgrönt. HTML använder en speciell tagg för att skapa kommentarer i din kod, texten inuti ett sådant element visas inte av webbläsaren. I CSS-kod, för att lägga till en kommentar, måste du placera kommentarstexten i följande struktur: /* kommentarstext */. Du kan göra kommentarer i CSS-kod både i inbyggda stilar och i externa (in separat fil).
Steg 3: Lägg till inline-stilar
Nästa steg är att lägga till inbyggda stilar på din sida: för rubriken på första nivån är textfärgen röd (färg: röd) och för stycken blå (färg: blå). Dessutom, för rubriken på första nivån kommer vi att göra texten justerad mot mitten (text-align: center). Kontrollera att varje CSS-egenskap och dess betydelse avgränsades av ett kolon, med ett semikolon i slutet av varje deklaration.
Det är bra att jag är engagerad i självutveckling.
Jag kan lära mig CSS på en månad eller mindre.
Steg 4: Visa HTML-sidan i en webbläsare
Öppna exemplet i en webbläsare och se till att resultatet av vårt exempel matchar bilden:
Ansluta en extern stilmall
Nu ska vi skapa en separat fil som kommer att innehålla en stilmall och koppla den till vårt HTML-dokument.
- Skapa en ny tom fil i Notepad++ och spara den som page.css (du måste välja Cascade Style Sheets *.css) i samma mapp där du skapade HTML-dokumentet.
- Flytta CSS-koden från föregående exempel (innehållet i taggen
Hej världen!