Introduktion til CSS-kommandoer

CSS står for Cascading Style Sheets. Det bruges til at beskrive præsentationen af ​​dokumentet, der er skrevet på et markup-sprog som HTML. Det gør arbejdet med adskillelse af præsentation og indhold, der inkluderer forskellige layout, farver og skrifttyper. Adskillelsen giver fleksibilitet og styrer også de forskellige egenskaber, der gør det muligt for flere websider at dele formatering ved at specificere relevant CSS. CSS-specifikationerne vedligeholdes af World Web Consortium. Derudover indeholder det også specifikke regler, der hjælper med alternativ formatering, hvis der er adgang til indholdet fra en mobilenhed.

Grundlæggende CSS-kommandoer

1. CSS-syntaks: Der er et sæt regler, der skal følges i CSS-kommando. CSS-regelsættet består af en vælger og en deklarationsblok. Vælgeren bruges til at pege på det HTML-element, som brugeren gerne vil style. Deklarationsblokken kan indeholde en eller flere erklæringer, der kan adskilles med semikolon. Hver erklæring skal indeholde et ejendomsnavn med dens værdi og disse adskilt med kolon.

2. ID-vælger : Id-vælgeren kan bruge id'et for en attribut af HTML-element og hjælpe med at vælge et bestemt element. Det bruges til at vælge et unikt element, og dette element skal være unikt for den side. For at vælge et element med et bestemt id bruges '#', og dette efterfølges af det pågældende elements id.

3. Klassevælger: For at vælge en bestemt klasseattribut bruges klassevælgeren til at vælge elementerne fra den klasse. For at gøre brug af elementer i en bestemt klasse bruges en periode (.) -Karakter. Det efterfølges af navnet på klassen. Med dette, hvis brugeren ønsker, at kun specifikke elementer skal bruges, kan kun disse specificeres af en klasse.

4. Gruppering af vælgere: Der er tidspunkter, hvor elementer har samme typedefinition. At få dem samlet og minimere koden er en bedre mulighed. For gruppen kan vælgerens bruger bruge et komma og adskille hver vælger

5. Bemærkninger: Det anbefales, at disse CSS-kommandoer bruges, når du skriver kode. De giver klarhed om, hvad koden gør, og hjælper dig eller en anden, der er ny med koden, til at arbejde på det i overensstemmelse hermed. Kommentarer ignoreres af browsere. En CSS-kommentar starter og slutter med / * * /.

6. Display: Blokering - Mange HTML-elementer er indstillet til denne visningstilstand. Som standard tager blokniveauelementerne lige så meget plads, og de kan ikke placeres på samme linje med nogen anden visningstilstand. Det er muligt at få evnen til at ændre elementets højde og bredde efter dit ønske.

7. Farver i CSS: I denne CSS-kommandoer kan farver specificeres i RGB-formel. Hver parameter definerer intensiteten af ​​disse farver og definerer en ny farve. For at vise sort skal alle farveparametre f.eks. Indstilles til RGB (0, 0, 0).

8. Baggrundsfarve: Egenskaben baggrundsfarve definerer den farve, der skal indstilles til baggrunden for et element. Farve kan let defineres ved at give et farvenavn, ved at tilføje en Hex-værdi eller ved at indstille RGB-værdi

9. Baggrundsbillede: Baggrundsbilledet kan indstilles til ethvert bestemt billede efter eget valg. Når billedet er indstillet, gentages det, og det dækker hele elementet.

10. CSS-marginer: CSS-kommando har forskellige marginegenskaber, som kan hjælpe med at skabe plads omkring forskellige elementer og definerer også disse udenfor grænser. CSS kan have egenskaber som margin-top, margin-right, margin-bottom og margin-left.

Mellemliggende CSS-kommandoer

1. Klasse- og ID-vælgere: Foruden HTML-tagget kan en bruger definere egne vælgere, der kan være i form af klasse eller ID. Den vigtigste anvendelse af disse er, at du kan have det samme HTML-element og præsentere det forskelligt baseret på det ID eller den klasse, der er nødvendig.

2. Pseudoklasse: Disse klasser bruges til at specificere en bestemt tilstand eller relation til en given vælger. Disse klasser kan også have form af vælger: pseudo_class (egenskab: værdi; ). Denne klasse defineres ved blot at give en kolon mellem vælgeren og pseudoklassen.

3. Tekstformatering: Teksterne, der tilføjes, kan tilpasses og formateres ved at bruge formateringsegenskaber. Farven kan ændres ved hjælp af nøgleordet 'farve'. Så kan tilpasningen af ​​tekst. Ved at gøre brug af tekstdekoration kan dekorationer indstilles og fjernes. Transformationer kan udføres med hensyn til sager.

4. CSS-skrifttyper: Skrifttyper i CSS har forskellige familier som generisk familie og fontfamilie. Skrifttypefamilien er en familie af tekster. Den generiske, der har en gruppe familier, der har lignende udseende og en skrifttype, der har en bestemt skrifttype.

5. Ikoner: Ved at gøre brug af ikonbiblioteket og tilføje navnet på specificerede ikonklasseikoner kan let bruges i CSS.

6. Tabeller: CSS kan også vise tabeller og hjælpe med tilpasning med rammer, deres bredde og højde. Ved at bruge nøgleord som 'kant', 'bredde' og højde kan brugeren let have tabeller på en webside.

7. Positionering: Denne egenskab specificerer den type positioneringsmetode, der kan bruges til ethvert element. Denne position kan være statisk, relativ, fast, absolut eller klæbrig.

8. Overløb: Denne egenskab hjælper med at kontrollere indholdet, der er for stort til at passe ind i et område.

9. Float: Float-egenskaben lader elementet vide, hvordan det skal flyde. Den specificerer, hvilke elementer der kan flyde ved siden af ​​de rydde elementer.

10. Opacity: Denne egenskab definerer ethvert elements opacitet eller gennemsigtighed.

Avancerede CSS-kommandoer

1. CSS afrundede hjørner: Ved at bruge egenskaben 'grænseradius' kan et element få afrundede hjørner. Du kan også specificere et bestemt hjørne ud af de fire hjørner og foretage ændringerne i henhold til dit valg.

2. Kantbilleder : Du kan indstille et billede som grænsen omkring ethvert element. Dette er muligt ved at bruge en grænse-billedsejendom. Den tager billedet og skærer det i ni sektioner og placerer derefter hjørnerne i hjørner og midterste sektioner gentages eller strækkes.

Tip og tricks til brug af CSS-kommandoer:

  • Brug reset.css og nulstil alle grundlæggende stilarter.
  • Brug Shorthand CSS til at have en kortere måde til at skrive Kommando CSS-koder.
  • Brug CSS-fejlfindingsværktøjer til at finjustere, forstå og debugge CSS-kommandostiler.

Konklusion

CSS Command hjælper dig med at holde informationsindholdet i et dokument adskilt og hjælper med at vise det. Det hjælper med at undgå dobbeltarbejde, vedligeholde koden let og bruge det samme indhold med forskellige stilarter.

Anbefalede artikler

Dette har været en guide til CSS-kommandoer. Her har vi drøftet grundlæggende, mellemliggende såvel som avancerede CSS-kommandoer. Du kan også se på den følgende artikel for at lære mere -

  1. Top MySQL-kommandoer
  2. PL / SQL-kommandoer
  3. Sådan bruges SQL-kommandoer
  4. Vinklede kommandoer

Kategori: