Citat - CSS-tricks

Anonim

Den quotesegendom i CSS kan du ange vilka typer av citat används när offerter läggs via content: open-quote;eller content: close-quote;regler. Så här använder du det:

q ( quotes: "“" "”" "‘" "’"; ) q::before ( content: open-quote; ) q::after ( content: close-quote; )

I exemplet ovan läggs fyra värden till. En uppsättning dubbla smarta offerter och ett par enkla smarta citat. Det är lite förvirrande eftersom varje citat är förpackat i citat - men det är bara programmatiska citat (kan vara dubbla (“) eller enkla (')) som någon annanstans i CSS. Citaten inuti är vad som kommer att användas på sidan.

Det finns fyra värden för innehållet egenskap som hänför sig till quotesfastigheten: open-quote, close-quote, no-open-quote, och no-close-quote.

Det första paret i offerten i värdet är inledande och avslutande offert. Det andra paret är de inledande och avslutande offerten för offerten som är kapslade en nivå djupt i andra offerter som också använder quotesfastigheten. Till exempel ett element inuti ett element.

Några exempel:

Dubbla citat på det första citatet, enstaka citat på det andra.

Ett citat med franska citat.

Du kan placera så många offertpar quotessom du vill. Men du behöver inte lägga mer än två, för för varje extra offert upprepar det helt enkelt quotesvärdena från början.

Den no-open-quoteoch no-close-quotevärderingar stoppa citat från att visa, men de fortsätter att öka citatet djup.

Mer information

  • Använd inte elementet om du inte citerar någon. I alla andra fall (ironi, sarkasm eller allt annat du använder citat för) använder du bara citattecken själva (så här: “”).
  • Det här är inte bara för elementet, det kan vara
    också eller något annat.
  • Citat & accenter

Webbläsarstöd

Krom Safari Firefox Opera IE Android iOS
11+ Några 1,5+ 4+ 8+ Några Några