Opprette og bruke en stil

Viktig: Denne artikkelen er maskinoversatt, se ansvarsfraskrivelsen. Du finner den engelske versjonen av artikkelen her som referanse.

En stil er et sett med formateringsinnstillinger som er definert i et gjennomgripende stilark (CSS). Du kan bruke stiler som innhold i en nettside, inkludert tekst (enkelttegn eller hele avsnitt), grafikk, lag, tabeller og partall til brødteksten i hele websiden. Stiler gjør det mulig å bruke et sett med egenskaper og verdier uten å måtte angi egenskapene hver gang du vil bruke dem effektivt.

Stilene i en CSS Overlapp henviser globale stilregler gjelder for HTML-elementer med mindre reglene for lokale stil overskriver dem. Generelt forrang lokale stilregler over generelle stilregler. En stil som er definert i en intern CSS på en nettside overstyrer for eksempel en stil som er definert i et eksternt CSS. På samme måte, en innebygd CSS defineres innenfor et enkelt HTML-element på nettsiden overstyrer alle stiler som er definert for det samme elementet i den interne eller eksterne CSS på websiden. Delene av globale stilregler som ikke er contradicted av lokale CSS stilregler gjelder for HTML-elementer selv når lokal stiler brukes.

I denne artikkelen

Stiltypene

Opprette en stil

Bruke en stil

Stiltypene

En stil som befinner seg i en ekstern eller intern CSS kan være klassebaserte, elementbaserte eller id-baserte. En stil er definert av regelsettet, som består av en velger, etterfulgt av en blokk med postdeklarasjon for egenskapen som vises mellom venstre klammeparentes ({}) og høyre klammeparentes (}). Hver type stil er forskjellig fra de andre stiltypene sin datavalg; et punktum (.) kommer foran velgeren for en klassebaserte stil; nummertegn (#) står foran velgeren for en id-baserte stil; og velgeren for en elementbaserte stil bare består av et HTML-element, for eksempel H1-elementet.

Klassebaserte stiler

Bruk klassebaserte stiler til å definere et sett med egenskaper som du vil bruke på én eller flere elementer i en nettside. Hvis du vil endre stilen, kan du redigere stilen regel sett og hvert element du har brukt stilen til å automatisk vise endringene.

I eksemplet nedenfor er "innføring" stilen datavalg og "skriftstørrelse: small" er én egenskap-deklarasjonen, etterfulgt av en annen egenskapsdeklarasjon.

Eksempel på en regel som er angitt for en klassebaserte stil

.introduction {font-size: small; color: white}

Eksempel på en klassebaserte stil brukt på en < p >-kode

<p class="introduction">

Elementbaserte stiler

Bruk elementbaserte stiler til å definere et sett med egenskaper som du vil hver forekomst av en bestemt HTML-element som skal brukes i en nettside. Hvis du for eksempel for å opprette en marg på 25 piksler rundt alle avsnitt (innhold i omgitt av < p > koder) på websiden, oppretter du en elementbaserte stil som bruker p-elementet som datavalg og inneholder deklarasjoner for marg egenskaper, som vist i følgende kode.

Eksempel på en regel som er angitt for en elementbaserte stil

p { margin-left: 25px; margin-right: 25px }

ID-baserte stiler

Bruk en stil for id-baserte når du vil definere et sett med egenskaper for et enkelt element eller en blokk med elementer du vil skille fra alt annet innhold i én eller flere nettsider. Bruk en stil for id-baserte når du vil stil et enkelt HTML-element på en nettside.

Eksempel på en regel som er angitt for en id-baserte stil

#footer {background-color: #CCCCCC; margin: 15px}

Eksempel på en id-baserte stil brukt på en < p >-kode

<p id="footer">

Innebygde stiler

Bruke en innebygd stil når du skal definere et sett med egenskaper for et enkelt element eller en blokk med elementer i en nettside og ikke vil bruke denne stilen. I motsetning til id-baserte, elementbaserte og klassebaserte stiler med egenskaper er definert i hode delen av en nettside (intern CSS) eller i en ekstern CSS-fil, egenskapene for et linjebundet stiler (eller innebygd CSS) er definert direkte i HTML-elementet du vil bruke stilen.

Eksempel på en regel som er angitt for en innebygd stil

<p style="font-weight: bold; font-style: italic; color: #FF0000">

Til toppen av siden

Opprette en stil

Du kan opprette nye stiler fra grunnen av eller ved å kopiere en eksisterende stil. Uansett kan dialogboksen Ny stil du definere alt om den nye stilen, inkludert typen datavalg, egenskaper og stilark som skal inneholde stilen. Når du vil opprette en ny innebygd stil, kan du også bruke oppgaveruten CSS-egenskaper. Når du vil bruke til å opprette og bruke en ny stil på siden uten å angi eventuelle egenskaper for stilen, kan du også bruke verktøylinjen for stil.

Opprette en stil ved hjelp av dialogboksen Ny stil

  1. Gjør ett av følgende:

    • Hvis du vil legge til en stil i et eksternt CSS, åpner du CSS-filen.

    • Hvis du vil legge til en stil i en intern CSS, kan du åpne nettsiden.

    • Legge til en innebygd stil, åpner websiden, og deretter merker du innholdet du vil formatere.

  2. Gjør ett av følgende:

    • Slik oppretter du en ny stil    Klikk Ny stil i en av disse plasseringene: oppgaveruten Bruk stiler eller oppgaveruten Behandle stiler, stil-verktøylinjen eller Format-menyen.

    • Kopiere en eksisterende stil    Gjør ett av følgende:

      • Pek på stilen du vil kopiere, klikk pil ned som vises, og velg deretter Ny stil kopi i oppgaveruten Bruk stiler.

      • I oppgaveruten Behandle stiler eller oppgaveruten CSS-egenskaper, høyreklikker du stilen du vil kopiere, og velg deretter Ny stil Kopier.

  3. Gjør følgende i dialogboksen Ny stil:

Bruk dette elementet

Hvis du vil

Datavalg

  • Hvis du vil bruke en klassevelger, skriver du inn et punktum (.) etterfulgt av et unikt navn.

  • Hvis du vil bruke ID-valg, skriver du inn et nummertegn (#) etterfulgt av et unikt navn.

    Merknad: Klassen og id velgeren kan ikke inneholde mellomrom med mindre du oppretter en kompleks velger.

  • Hvis du vil bruke et element datavalg, enten skriver du inn navnet på et HTML-element eller klikker rullegardinlisten datavalg og velger et elementnavn.

  • Hvis du vil bruke en innebygd datavalg, velger du innebygd stil.

  • Hvis du vil opprette en kompleks velger, skriver du inn velgeren.

Definere i

Velg ett av følgende:

  • Gjeldende side legger til den nye stilen i den interne CSS på gjeldende Web-side.

  • Nye stilark legger til den nye stilen i en ny, tom eksterne CSS.

  • Eksisterende stilark legger til den nye stilen i et eksisterende eksternt CSS du angir.

Bruk ny stil på dokumentet merket område

Bruke stilen i det gjeldende utvalget i den gjeldende websiden.

URL-ADRESSE

Hvis du valgte eksisterende stilark i Definer i, kan du angi URL-Adressen til CSS-fil.

Kategori

Velg ett av følgende, og angi deretter egenskapene som vises til høyre i dialogboksen:

Tips!: Kategorier som vises i fet i kategori-listen inneholder angi egenskaper.

  • Skriftsett skriftegenskaper, inkludert størrelse, vekt, pynt og farge.

  • Blokker angir linje høyde, tekstjustering, Tekstinnrykk og tekstavstand.

  • Bakgrunn angir bakgrunn Bildeegenskaper for farge og bakgrunn.

  • Kantlinje angir en kantlinje og egenskapene.

  • Boksen angir egenskaper for utfylling og marger-boksen og blokker nivå elementer.

  • Plassering angir målene og plasseringen av boksen og blokker nivå elementer.

  • Oppsettet Angir synligheten, flytende og bryte virkemåten, skjermutklipp og andre egenskaper for oppsett av boksen og blokker nivå elementer.

  • Listen angir egenskaper for listeelementer, inkludert type, plassering og bilde.

  • Tabell angir egenskaper for tabell-relaterte elementer, inkludert avstand, oppsett og egenskaper for kantlinje.

Merknad: Du kan også kopiere en stil fra én CSS til en annen. Dra stilen i oppgaveruten Behandle stiler fra CSS som inneholder stilen til navnet CSS du vil kopiere den til, eller til et bestemt punkt i listen over stiler i målet CSS.

Opprette en innebygd stil ved hjelp av oppgaveruten CSS-egenskaper

  1. Velg innholdet du vil legge til en innebygd stil til i utformingsvisning eller kodevisning i nettsiden.

  2. I oppgaveruten CSS-egenskaper under Brukt regler, høyreklikk velgeren du vil bruke den innebygde stilen til, eller, hvis "(ingen regler brukes) " vises, høyreklikker du hvor som helst under Brukt regler, og klikk deretter Ny innebygd stil på hurtigmenyen.

  3. Angi egenskapene du vil bruke under CSS-egenskaper.

Opprette og bruke en ny udefinert stil

Du kan opprette stiler og bruke dem på elementer og deretter definere stilene senere. Hvis du vil arbeide med en designer til å opprette utseendet på siden, kan du for eksempel bruke udefinert stiler på elementene på siden deretter PCen med designer til å definere stilene senere.

  1. I utformingsvisning eller kodevisning på websiden, velger du elementet du vil bruke en stil på.

  2. Hvis du vil opprette og bruke en ny stil uten å definere eventuelle egenskaper på verktøylinjen stil i klassen eller ID-boksen skriver du inn et unikt navn for den nye stilen.

Til toppen av siden

Bruke en stil

Du kan bruke oppgaveruten Bruk stiler, oppgaveruten Behandle stiler eller stil-verktøylinjen til å bruke klassebaserte eller id-baserte stiler fra ditt interne og eksterne gjennomgripende stilark (CSS). Oppgaveruten Bruk stiler kan du bruke flere stiler på et utvalg, mens oppgaveruten Behandle stiler og verktøylinjen stil er begrenset til å bruke en stil. Verktøylinjen for stil kan du raskt gi navn til og bruke nye udefinert stiler på siden.

Du trenger ikke å bruke stiler som bruker et element for en velger (elementbaserte stiler) fordi disse type stiler brukes automatisk til de tilknyttede elementet i en nettside. Oppgaveruten Bruk stiler viser elementbaserte stiler under Kontekstavhengige velgere, og sammen med aktiviteten Behandle stiler-ruten viser en blå prikk ved siden av stilnavnet. Verktøylinjen for stil list ikke elementbaserte stiler.

  1. I utformingsvisning eller kodevisning på websiden, velger du elementet du vil bruke en stil på.

  2. Gjør ett av følgende:

    • Bruke flere eksisterende stiler    I oppgaveruten Bruk stiler, trykker du CTRL mens du klikker hver stilen du vil bruke.

    • Å bruke en enkelt eksisterende stil    Gjør ett av følgende:

      • Klikk klassen eller id-stilen du vil bruke, i oppgaveruten Bruk stiler.

      • På verktøylinjen stil i klassen eller ID rullegardinlisten, klikker du stilen du vil bruke.

      • Høyreklikk klasse eller id stilen du vil bruke, og deretter Bruke stil på hurtigmenyen i oppgaveruten Behandle stiler.

    • Du oppretter og angir en ny stil uten å definere eventuelle egenskaper    Skriv inn et unikt navn for den nye stilen i klassen eller ID-boksen på verktøylinjen for stil.

Til toppen av siden

Merknad: Ansvarsfraskrivelse for maskinoversettelse: Denne artikkelen er oversatt av et datasystem i stedet for en oversetter. Microsoft tilbyr disse maskinoversettelsene slik at brukere som ikke snakker engelsk, får tilgang til innhold om Microsoft-produkter, -tjenester og –teknologier. Ettersom artikkelen er maskinoversatt, kan den inneholde feil i vokabular, syntaks eller grammatikk.

Utvid ferdighetene dine
Utforsk opplæring
Vær først ute med de nye funksjonene
Bli med i Office Insiders

Var denne informasjonen nyttig?

Takk for tilbakemeldingen!

Takk for tilbakemeldingen! Det høres ut som det kan være lurt å sette deg i kontakt med én av våre Office-kundestøtteagenter.

×