Introduksjon til CSS-kommandoer
CSS står for Cascading Style Sheets. Det brukes til å beskrive presentasjonen av dokumentet som er skrevet på et merkspråk som HTML. Det gjør arbeidet med separasjon av presentasjon og innhold som inkluderer forskjellige layout, farger og skrifter. Separasjonen gir fleksibilitet og kontroll også i de forskjellige egenskapene som gjør at flere websider kan dele formatering ved å spesifisere relevant CSS. CSS-spesifikasjonene opprettholdes av World Web Consortium. I tillegg til dette gir det også spesifikke regler som hjelper i alternativ formatering hvis innholdet nås fra en mobil enhet.
Grunnleggende CSS-kommandoer
1. CSS Syntax: Det er et sett med regler som må følges i CSS Command. CSS-regelsettet består av en velger og en deklarasjonsblokk. Velgeren brukes til å peke på HTML-elementet som brukeren ønsker å style. Deklarasjonsblokken kan inneholde en eller flere erklæringer som kan skilles ved semikolon. Hver erklæring bør inneholde et eiendomsnavn med dens verdi og disse atskilt med kolon.
2. ID-velger : ID-velgeren kan bruke IDen til et attributt for HTML-element og hjelpe til med å velge et bestemt element. Det brukes til å velge ett unikt element, og dette elementet skal være unikt for den siden. For å velge et element med en bestemt ID, brukes '#', og dette blir fulgt av idet til det elementet.
3. Klassevælger: For å velge en bestemt klasseattributt brukes klassevelgeren til å velge elementene fra den klassen. For å gjøre bruk av elementer i en bestemt klasse brukes en periode (.) Karakter. Det blir fulgt av navnet på klassen. Med dette, hvis brukeren ønsker at bare spesifikke elementer skal brukes, kan bare de spesifiseres av en klasse.
4. Gruppere velgere: Det er tider når elementer har samme stildefinisjon. Å få dem samlet og minimere koden er et bedre alternativ. For gruppen kan velgerens bruker gjøre bruk av komma og skille hver velger
5. Kommentarer: Disse CSS-kommandoene anbefales å brukes når du skriver kode. De gir klarhet i hva koden gjør, og hjelper deg eller noen andre som er ukjente med koden til å arbeide med den. Kommentarer blir ignorert av nettlesere. En CSS-kommentar starter og slutter med / * * /.
6. Display: Blokkering - Mange HTML-elementer er satt til denne visningsmodusen. Som standard tar blokkeringselementene like mye plass, og de kan ikke plasseres på samme linje med noen annen visningsmodus. Det er mulig å få evnen til å endre elementets høyde og bredde etter ønske.
7. Farger i CSS: I disse CSS-kommandoene kan farger spesifiseres i RGB-formel. Hver parameter definerer intensiteten til disse fargene og definerer en ny farge. For å vise svart, bør alle fargeparametere være satt til RGB (0, 0, 0).
8. Bakgrunnsfarge: Bakgrunnsfargeegenskapen definerer fargen som skal settes for bakgrunnen til et element. Farge kan enkelt defineres ved å gi et fargenavn, ved å legge til en Hex-verdi eller ved å sette RGB-verdi
9. Bakgrunnsbilde: bakgrunnsbildet kan stilles inn på et hvilket som helst bestemt bilde du ønsker. Når bildet er satt, blir det gjentatt, og det dekker hele elementet.
10. CSS-marginer: CSS-kommando har forskjellige marginegenskaper som kan bidra til å skape rom rundt forskjellige elementer og definerer også disse utenfor grensene. CSS kan ha egenskaper som margin-top, margin-right, margin-bottom og margin-left.
Mellomliggende CSS-kommandoer
1. Klasse- og ID-velgere: I tillegg til HTML-taggen, kan en bruker definere egne velgere som kan være i form av klasse eller ID. Hovedbruken av disse er at du kan ha det samme HTML-elementet og presentere det på en annen måte basert på IDen eller klassen som er nødvendig.
2. Pseudoklasse: Disse klassene brukes til å spesifisere en bestemt tilstand eller forhold til en gitt velger. Disse klassene kan også ha form av selektor: pseudo_class (eiendom: verdi; ). Denne klassen defineres ved ganske enkelt å gi en kolon mellom velgeren og pseudoklassen.
3. Tekstformatering: Tekstene som er lagt til kan tilpasses og formateres ved å bruke formateringsegenskapene. Fargen kan endres ved å bruke nøkkelordet 'farge'. Så kan justering av tekst. Ved å bruke tekstdekorasjon kan dekorasjoner settes og fjernes. Transformasjoner kan gjøres med hensyn til saker.
4. CSS-skrifter: Fonter i CSS har forskjellige familier som generisk familie og fontfamilie. Fontfamilien er en familie av tekster. Den generiske som har en gruppe familier med lignende utseende og font en som har en spesifikk font.
5. Ikoner: Ved å gjøre bruk av ikonbiblioteket og legge til navnet på spesifiserte ikoner, kan ikoner av klasser lett brukes i CSS.
6. Tabeller: CSS kan også vise tabeller og hjelpe til tilpasning med grenser, bredde og høyde. Ved å bruke nøkkelord som 'kant', 'bredde' og høyde kan brukeren enkelt ha tabeller på en webside.
7. Plassering: Denne egenskapen spesifiserer hvilken type posisjonsmetode som kan brukes for ethvert element. Denne stillingen kan være statisk, relativ, fast, absolutt eller klebrig.
8. Overflyt: Denne egenskapen hjelper deg med å kontrollere innholdet som er for stort til å passe inn i et område.
9. Float: Float-egenskapen lar elementet vite hvordan det skal flyte. Den spesifiserer hvilke elementer som kan flyte ved siden av de slettede elementene.
10. Opacity: Denne egenskapen definerer opaciteten eller åpenheten til ethvert element.
Avanserte CSS-kommandoer
1. CSS avrundede hjørner: Ved å bruke 'grense-radius' -egenskap kan et element gis avrundede hjørner. Du kan også spesifisere et bestemt hjørne av de fire hjørnene og gjøre endringene per valg.
2. Kantbilder : Du kan angi et bilde som grensen rundt ethvert element. Dette er mulig ved å gjøre bruk av en grense-bildegenskap. Den tar bildet og skiver det i ni seksjoner og plasserer deretter hjørnene i hjørnene og midtre seksjoner gjentas eller strekkes.
Tips og triks for å bruke CSS-kommandoer:
- Benytt deg av reset.css og tilbakestill alle grunnleggende stiler.
- Bruk Shorthand CSS for å ha en kortere måte å skrive Command CSS-koder på.
- Bruk CSS feilsøkingsverktøy for å finjustere, forstå og feilsøke CSS-kommandostilene.
Konklusjon
CSS Command hjelper deg med å holde informasjonsinnholdet i et dokument atskilt og hjelper deg med å vise det. Det hjelper med å unngå duplisering, vedlikeholde koden enkelt og bruke samme innhold med forskjellige stiler.
Anbefalte artikler
Dette har vært en guide til CSS-kommandoer. Her har vi diskutert grunnleggende, mellomliggende så vel som avanserte CSS-kommandoer. Du kan også se på følgende artikkel for å lære mer -
- Topp MySQL-kommandoer
- PL / SQL-kommandoer
- Slik bruker du SQL-kommandoer
- Kantete kommandoer