Een eenvoudige CSS-stylesheet maken met Kladblok

Video: CSS Tutorial How to create css style sheet in Notepad ++?

Inhoud

Stappen
Tips
Dingen die je nodig hebt

Kladblok is een van de teksteditors die kan worden gebruikt om een Cascading Style Sheet (CSS)-document te maken. Nadat u een CSS-bestand in Kladblok hebt gemaakt, kunt u dat bestand koppelen aan een webpagina zodat de inhoud van de webpagina kan worden opgemaakt met uw stylesheet.

Stappen

1 Open het Kladblok-programma.
2Kopieer de volgende code:

@charset "utf-8"; / * CSS Document * // * Definieer de kleur van het body-element * / body {background: # FFFFFF;} / * Deze sectie is voor links * / a: link { lettergewicht: normaal; kleur: Navy} a: bezocht {font-weight: normal; kleur: Groen;} a: zweef {lettergewicht: vet; kleur rood; font-variant: small-caps;} / * Deze sectie is voor een alineasectie * / p {font-style: cursief; font-size: 18px;} blue {color: # 0000FF;} / * Dit gedeelte is voor de zwarte rand van de afbeelding * / img {border-color: # 000000; rand: dik; border-stijl: nok;}

# Plak de code van "Stap 2" in Kladblok.

1 Sla het bestand op in Kladblok. Sla het op onder de naam "SimpleCSS.css" door op de knop "Bestand" te klikken en de opdracht "Opslaan" te kiezen. Nadat u op de knop "Opslaan" hebt geklikt, wordt het dialoogvenster "Opslaan als" weergegeven.
2 Geef je CSS-bestand een naam. Typ "SimpleCSS.css" of een andere naam in het tekstvak "Bestandsnaam" met de extensie ".css".
3 Klik op de knop "Opslaan".
4 Het is gebeurd!

Tips

Sla het Kladblok-bestand op als Alleen tekst (soms noem je het Tekstdocument of ASCII) en geef het de extensie ".css".
De code die we hier hebben geschreven, is slechts een voorbeeld om u te laten zien hoe u een eenvoudig CSS-bestand maakt met Kladblok om de HTML-elementen ervan te manipuleren in onze voorbeeldwebpagina die wordt weergegeven in het gedeelte Inleiding. U kunt onze CSS-codering echter wijzigen, hoe u de stijlen en het uiterlijk van de webpagina's wilt opmaken.
Vergeet niet om het opgeslagen CSS-document in dezelfde map te plaatsen als uw HTML-documenten waarin u uw webpagina's hebt gemaakt.
Nadat u uw CSS-document hebt gemaakt, moet u mogelijk de volgende stap nemen; dat wil zeggen, koppel een document en een webpagina. Raadpleeg hiervoor de gerelateerde artikelen.