Properties

Properties

Draft
  • account_tree
  • bug_report

contentCSS2.1

가상 요소로 생성할 콘텐츠를 설정한다.

설정 가능한 속성 값

  • normal기본값키워드CSS2.1

    가상 요소가 지정된 경우 가상 요소를 제거한다.

  • none키워드CSS2.1

    가상 요소를 설정하지 않는다.

  • string문자열CSS2.1

    가상 요소로 사용하고자 하는 콘텐츠를 텍스트로 설정한다. TAG는 사용할 수 없다.

  • url()함수CSS2.1

    이미지를 가상 요소로 생성한다.

  • attr()함수CSS2.1

    가상 요소를 추가하고자 하는 요소의 속성(Attribute)의 값을 이용하여 가상 요소로 생성한다.

  • counter()함수CSS2.1

    번호를 매기는 값으로 가상 요소를 생성한다.

  • open-quote키워드CSS2.1

    여는 인용부호(따옴표)를 가상 요소로 생성한다.

  • close-quote키워드CSS2.1

    닫는 인용부호(따옴표)를 가상 요소로 생성한다.

  • no-open-quote키워드CSS2.1

    생성된 여는 인용부호(따옴표) 가상 요소를 제거한다.

  • no-close-quote키워드CSS2.1

    생성된 닫는 인용부호(따옴표) 가상 요소를 제거한다.

  • initial키워드CSS3

    웹브라우저 기본 값으로 적용한다.

구문

  • content any-text;사용 예CSS2.1

    따옴표로 감싼 문자열을 가상 요소로 설정한다.

    텍스트로 가상 요소를 생성한다.
  • content any-special-character-code기본형식CSS2.1

    특수 문자 코드를 따옴표로 문자열로 지정하되 앞에 역슬래시를 두어야 한다.

    특수 문자 코드를 사용하여 가상 요소를 생성한다.
  • content attr(href);사용 예CSS2.1
    가상 요소를 삽입할 요소의 속성 값을 가상 요소로 생성한다.
  • content url(image-path);기본형식CSS2.1
    특수 문자 코드를 사용하여 가상 요소를 생성한다.
  • content counter(counter);기본형식CSS2.1
    일련 번호를 가상 요소를 생성한다.
  • content open-quote;사용 예CSS2.1
    따옴표를 가상 요소를 생성한다.

버전 명세

Version NameDescriptionFlags
CSS2.1

기술 문서

Special Characters

다음 아래는 CSS에서 가상 요소로 사용할 수 있는 특수문자중 일부이다. 

SymbolDescriptionCSS
"quotation markp:before{content:"\0022";}
&ampersandp:before{content:"\0026";}
<less-than signp:before{content:"\003c";}
>greater-than signp:before{content:"\003e";}
 no-break spacep:before{content:"\00a0";}
¡inverted exclamation markp:before{content:"\00a1";}
¢cent signp:before{content:"\00a2";}
£pound sterling signp:before{content:"\00a3";}
¤general currency signp:before{content:"\00a4";}
¥yen signp:before{content:"\00a5";}
euro signp:before{content:"\20AC";}
¦broken (vertical) barp:before{content:"\00a6";}
§section signp:before{content:"\00a7";}
¨umlaut (dieresis)p:before{content:"\00a8";}
©copyright signp:before{content:"\00A9";}
trademark signp:before{content:"\2122";}
ªordinal indicator, femininep:before{content:"\00aa";}
«angle quotation mark, leftp:before{content:"\00ab";}
¬not signp:before{content:"\00ac";}
­soft hyphenp:before{content:"\00ad";}
®registered signp:before{content:"\00ae";}
¯macronp:before{content:"\00af";}
°degree signp:before{content:"\00b0";}
degree celsius signp:before{content:"\2103";}
degree fahrenheit signp:before{content:"\2109";}
±plus-or-minus signp:before{content:"\00b1";}
²superscript twop:before{content:"\00b2";}
³superscript threep:before{content:"\00b3";}
´acute accentp:before{content:"\00b4";}
µmicro signp:before{content:"\00b5";}
pilcrow (paragraph sign)p:before{content:"\00b6";}
·middle dotp:before{content:"\00b7";}
¸cedillap:before{content:"\00b8";}
¹superscript onep:before{content:"\00b9";}
ºordinal indicator, masculinep:before{content:"\00ba";}
»angle quotation mark, rightp:before{content:"\00bb";}
¼fraction one-quarterp:before{content:"\00bc";}
½fraction one-halfp:before{content:"\00bd";}
¾fraction three-quartersp:before{content:"\00be";}
¿inverted question markp:before{content:"\00bf";}
Àcapital A, grave accentp:before{content:"\00c0";}
Ácapital A, acute accentp:before{content:"\00c1";}
Âcapital A, circumflex accentp:before{content:"\00c2";}
Ãcapital A, tildep:before{content:"\00c3";}
Äcapital A, dieresis or umlaut markp:before{content:"\00c4";}
Åcapital A, ringp:before{content:"\00c5";}
Æcapital AE diphthong (ligature)p:before{content:"\00c6";}
Çcapital C, cedillap:before{content:"\00c7";}
Ècapital E, grave accentp:before{content:"\00c8";}
Écapital E, acute accentp:before{content:"\00c9";}
Êcapital E, circumflex accentp:before{content:"\00ca";}
Ëcapital E, dieresis or umlaut markp:before{content:"\00cb";}
Ìcapital I, grave accentp:before{content:"\00cc";}
Ícapital I, acute accentp:before{content:"\00cd";}
Îcapital I, circumflex accentp:before{content:"\00ce";}
Ïcapital I, dieresis or umlaut markp:before{content:"\00cf";}
Ðcapital Eth, Icelandicp:before{content:"\00d0";}
Ñcapital N, tildep:before{content:"\00d1";}
Òcapital O, grave accentp:before{content:"\00d2";}
Ócapital O, acute accentp:before{content:"\00d3";}
Ôcapital O, circumflex accentp:before{content:"\00d4";}
Õcapital O, tildep:before{content:"\00d5";}
Öcapital O, dieresis or umlaut markp:before{content:"\00d6";}
×multiply signp:before{content:"\00d7";}
Øcapital O, slashp:before{content:"\00d8";}
Ùcapital U, grave accentp:before{content:"\00d9";}
Úcapital U, acute accentp:before{content:"\00da";}
Ûcapital U, circumflex accentp:before{content:"\00db";}
Ücapital U, dieresis or umlaut markp:before{content:"\00dc";}
Ýcapital Y, acute accentp:before{content:"\00dd";}
Þcapital THORN, Icelandicp:before{content:"\00de";}
ßsmall sharp s, German (sz ligature)p:before{content:"\00df";}
àsmall a, grave accentp:before{content:"\00e0";}
ásmall a, acute accentp:before{content:"\00e1";}
âsmall a, circumflex accentp:before{content:"\00e2";}
ãsmall a, tildep:before{content:"\00e3";}
äsmall a, dieresis or umlaut markp:before{content:"\00e4";}
åsmall a, ringp:before{content:"\00e5";}
æsmall ae diphthong (ligature)p:before{content:"\00e6";}
çsmall c, cedillap:before{content:"\00e7";}
èsmall e, grave accentp:before{content:"\00e8";}
ésmall e, acute accentp:before{content:"\00e9";}
êsmall e, circumflex accentp:before{content:"\00ea";}
ësmall e, dieresis or umlaut markp:before{content:"\00eb";}
ìsmall i, grave accentp:before{content:"\00ec";}
ísmall i, acute accentp:before{content:"\00ed";}
îsmall i, circumflex accentp:before{content:"\00ee";}
ïsmall i, dieresis or umlaut markp:before{content:"\00ef";}
ðsmall eth, Icelandicp:before{content:"\00f0";}
ñsmall n, tildep:before{content:"\00f1";}
òsmall o, grave accentp:before{content:"\00f2";}
ósmall o, acute accentp:before{content:"\00f3";}
ôsmall o, circumflex accentp:before{content:"\00f4";}
õsmall o, tildep:before{content:"\00f5";}
ösmall o, dieresis or umlaut markp:before{content:"\00f6";}
÷divide signp:before{content:"\00f7";}
øsmall o, slashp:before{content:"\00f8";}
ùsmall u, grave accentp:before{content:"\00f9";}
úsmall u, acute accentp:before{content:"\00fa";}
ûsmall u, circumflex accentp:before{content:"\00fb";}
üsmall u, dieresis or umlaut markp:before{content:"\00fc";}
ýsmall y, acute accentp:before{content:"\00fd";}
þsmall thorn, Icelandicp:before{content:"\00fe";}
ÿsmall y, dieresis or umlaut markp:before{content:"\00ff";}
Œlatin capital ligature oep:before{content:"\0152";}
œlatin small ligature oep:before{content:"\0153";}
Šlatin capital letter s with caronp:before{content:"\0160";}
šlatin small letter s with caronp:before{content:"\0161";}
Ÿlatin capital letter y with diaeresisp:before{content:"\0178";}
ƒlatin small f with hook or functionp:before{content:"\0192";}
ˆmodifier letter circumflex accentp:before{content:"\02c6";}
˜small tildep:before{content:"\02dc";}
Αgreek capital letter alphap:before{content:"\0391";}
Βgreek capital letter betap:before{content:"\0392";}
Γgreek capital letter gammap:before{content:"\0393";}
Δgreek capital letter deltap:before{content:"\0394";}
Εgreek capital letter epsilonp:before{content:"\0395";}
Ζgreek capital letter zetap:before{content:"\0396";}
Ηgreek capital letter etap:before{content:"\0397";}
Θgreek capital letter thetap:before{content:"\0398";}
Ιgreek capital letter iotap:before{content:"\0399";}
Κgreek capital letter kappap:before{content:"\039a";}
Λgreek capital letter lambdap:before{content:"\039b";}
Μgreek capital letter mup:before{content:"\039c";}
Νgreek capital letter nup:before{content:"\039d";}
Ξgreek capital letter xip:before{content:"\039e";}
Οgreek capital letter omicronp:before{content:"\039f";}
Πgreek capital letter pip:before{content:"\03a0";}
Ρgreek capital letter rhop:before{content:"\03a1";}
Σgreek capital letter sigmap:before{content:"\03a3";}
Τgreek capital letter taup:before{content:"\03a4";}
Υgreek capital letter upsilonp:before{content:"\03a5";}
Φgreek capital letter phip:before{content:"\03a6";}
Χgreek capital letter chip:before{content:"\03a7";}
Ψgreek capital letter psip:before{content:"\03a8";}
Ωgreek capital letter omegap:before{content:"\03a9";}
αgreek small letter alphap:before{content:"\03b1";}
βgreek small letter betap:before{content:"\03b2";}
γgreek small letter gammap:before{content:"\03b3";}
δgreek small letter deltap:before{content:"\03b4";}
εgreek small letter epsilonp:before{content:"\03b5";}
ζgreek small letter zetap:before{content:"\03b6";}
ηgreek small letter etap:before{content:"\03b7";}
θgreek small letter thetap:before{content:"\03b8";}
ιgreek small letter iotap:before{content:"\03b9";}
κgreek small letter kappap:before{content:"\03ba";}
λgreek small letter lambdap:before{content:"\03bb";}
μgreek small letter mup:before{content:"\03bc";}
νgreek small letter nup:before{content:"\03bd";}
ξgreek small letter xip:before{content:"\03be";}
οgreek small letter omicronp:before{content:"\03bf";}
πgreek small letter pip:before{content:"\03c0";}
ρgreek small letter rhop:before{content:"\03c1";}
ςgreek small letter final sigmap:before{content:"\03C2";}
σgreek small letter sigmap:before{content:"\03C3";}
τgreek small letter taup:before{content:"\03C4";}
υgreek small letter upsilonp:before{content:"\03C5";}
φgreek small letter phip:before{content:"\03C6";}
χgreek small letter chip:before{content:"\03C7";}
ψgreek small letter psip:before{content:"\03C8";}
ωgreek small letter omegap:before{content:"\03C9";}
ϑgreek small letter theta symbolp:before{content:"\03D1";}
ϒgreek upsilon with hook symbolp:before{content:"\03D2";}
ϖgreek pi symbolp:before{content:"\03D6";}
en spacep:before{content:"\2002"}
em spacep:before{content:"\2003"}
thin spacep:before{content:"\2009"}
zero width non-joinerp:before{content:"\200C"}
zero width joinerp:before{content:"\200D"}
left-to-right markp:before{content:"\200E"}
right-to-left markp:before{content:"\200F"}
en dashp:before{content:"\2013"}
em dashp:before{content:"\2014"}
left single quotation markp:before{content:"\2018"}
right single quotation markp:before{content:"\2019"}
single low-9 quotation markp:before{content:"\201A"}
left double quotation markp:before{content:"\201C"}
right double quotation markp:before{content:"\201D"}
double low-9 quotation markp:before{content:"\201E"}
daggerp:before{content:"\2020"}
double daggerp:before{content:"\2021"}
per mille signp:before{content:"\2030"}
single left-pointing angle quotation markp:before{content:"\2039"}
single right-pointing angle quotation markp:before{content:"\203A"}
infinityp:before{content:"\221E";}
filled phonep:before{content:"\260E";}
blank phonep:before{content:"\260F";}
filled universal recycling symbolp:before{content:"\267B";}
blank universal recycling symbolp:before{content:"\2672";}
filled recycled paper symbolp:before{content:"\267C";}
blank recycled paper symbolp:before{content:"\267D";}
staff of aesculapiusp:before{content:"\2695";}
lower right pencilp:before{content:"\270E";}
crossp:before{content:"\271D";}
star of davidp:before{content:"\2721";}
filled starp:before{content:"\272D";}
blank starp:before{content:"\2729";}

지원 웹브라우저