CSS 콘텐츠를 사용하여 HTML 엔터티 추가

CSS 콘텐츠를 사용하여 HTML 엔터티 추가

CSS를 어떻게 사용합니까? contentHTML 엔티티를 추가할 속성?

이런 것을 사용하면 그냥 인쇄됩니다. 공백이 아닌 화면으로 이동합니다.

.breadcrumbs a:before {
  content: ' ';
}

이스케이프된 유니코드를 사용해야 합니다.

맘에 들다

.breadcrumbs a:before {
  content: '\0000a0';
}

자세한 내용은 http://www.evotech.net/blog/2007/04/named-html-entities-in-numeric-order/ 에서 확인하십시오.

HTML이 . CSS는 HTML입니다. HTML의 명명된 문자 참조입니다. 십진수 문자 참조와 동일합니다. 160은 의 십진수 코드 포인트입니다.NO-BREAK SPACE유니코드 문자(또는 UCS-2; HTML 4.01 사양 참조).이 코드 포인트의 16진수 표현은 U+00A0(160 = 10 × 16¹ + 0 × 16⁰)입니다.유니코드 코드 차트 및 문자 데이터베이스에서 확인할 수 있습니다.

CSS에서는 이러한 문자에 대해 유니코드 이스케이프 시퀀스를 사용해야 하며, 이는 문자 코드 포인트의 16진수 값을 기반으로 합니다.그래서 당신은 글을 써야 합니다.

.breadcrumbs a:before {
  content: '\a0';
}

이스케이프 시퀀스가 문자열 값의 마지막에 오는 한 작동합니다.문자가 이어지는 경우 잘못된 해석을 방지하는 두 가지 방법이 있습니다.

(다른 사람들이 언급함) 이스케이프 시퀀스에 정확히 6자리 16진수를 사용합니다.

.breadcrumbs a:before {
  content: '\0000a0foo';
}

이스케이프 시퀀스 뒤에 공백(예: 공백) 문자를 하나 추가합니다.

.breadcrumbs a:before {
  content: '\a0 foo';
}

)f 16진수입니다.\a0f그렇지 않다면 의미할 것입니다.GURMUKHI LETTER EE여기 또는 적합한 글꼴이 있는 경우 ਏ)

되고 "" " "" " ""로 됩니다. foo은 여에표공간은된시입니다.NO-BREAK SPACE성격.

어프로치 (White-spaceapproach()'\a0 foo' 접근법과 같은 .'\0000a0foo'):

• 선행 0이 필요하지 않고 숫자를 셀 필요가 없기 때문에 입력하기가 더 쉽습니다.
• 이스케이프 시퀀스와 이어지는 텍스트 사이에는 공백이 있고 숫자를 셀 필요가 없기 때문에 읽기가 더 쉽습니다.
• 선행 0이 필요하지 않기 때문에 더 적은 공간이 필요합니다.
• 향후 U+10FFFF 이상의 코드 포인트를 지원하는 유니코드는 CSS 사양의 수정이 필요할 것이기 때문에 상위 호환성이 있습니다.

따라서 이스케이프 문자 뒤에 공백을 표시하려면 스타일시트에서 두 개의 공백을 사용합니다.

.breadcrumbs a:before {
  content: '\a0  foo';
}

또는 명시적으로 설명합니다.

.breadcrumbs a:before {
  content: '\a0\20 foo';
}

자세한 내용은 CSS 2.1, 섹션 "4.1.3 문자 및 대소문자"를 참조하십시오.

업데이트: PointedEars는 올바른 기준을 제시합니다. 에서, 에 css 상서모황이 될 것입니다.
'\a0 '공간이 16진수 문자열의 종결자이고 탈출 시퀀스에 의해 흡수된다는 것을 암시합니다.그는 또한 제가 아래에서 설명하고 수정한 문제에 대한 좋은 해결책으로 들리는 이 권위 있는 설명을 지적했습니다.

이스케이프된 유니코드를 사용해야 합니다.당신이 들은 이야기에도 불구하고\00a0의 완벽한 대리인은 아닙니다. CSS 내에서, 시도:

content:'>\a0 ';          /* or */
content:'>\0000a0';       /* because you'll find: */
content:'No\a0 Break';    /* and */
content:'No\0000a0Break'; /* becomes No Break as opposed to below */

으로 으로기사하용적을 사용합니다.\0000a0~하듯이 마티외와 밀리킨이 제안한 바와 같이 시도해 보면 다음과 같습니다.

content:'No\00a0Break'   /* becomes No਋reak */

B를 16진수 이스케이프 문자로 변환합니다.0-9a-fA-F에서도 동일한 현상이 발생합니다.

CSS에서는 HTML 엔티티 대신 유니코드 이스케이프 시퀀스를 사용해야 합니다.이 값은 문자의 16진수 값을 기반으로 합니다.

하는 가장 쉬운 ( 는저진기 16수등가변가▾방쉬는환장법이다와니운하습발했것견로을는를호같것)와 같은 것이라는 것을 되었습니다.▾에서 )까지\25BE) Microsoft 계산기입니다. =)

모드를 시스템을 , 네를 입력합니다. 래머모드십을진켜고법다입음다력을니합고활성프하를화그로▁yes다,니력입▁enable합mers▁mode음▁turn.9662그러면 16진수로 전환하면 얻을 수 있습니다.25BE그런 다음 백슬래시를 추가합니다.\처음부터 끝까지

공백이 없는 경우 16진수 코드를 사용합니다.이와 같은 것:

.breadcrumbs a:before {
  content: '>\00a0';
}

다음을 붙여넣는 방법이 있습니다.nbspCharMap을 열고 160 문자를 복사합니다.그러나 이 경우에는 다음과 같이 패딩을 사용하여 공간을 확보할 수 있습니다.

.breadcrumbs a:before { content: '>'; padding-right: .5em; }

할.display:inline-block하지만 뭐 그런 것도.

예:

http://character-code.com/arrows-html-codes.php

예:캐릭터를 선택하고 싶다면 &#8620 &#x21ac을 선택했습니다. (우리는 HEX 값을 사용합니다.)

.breadcrumbs a:before {
  content: '\0021ac';
}

결과: ↬

그게 다야 :)

이것이 꽤 오래된 게시물이라는 것은 알지만, 띄어쓰기가 전부라면, 왜 간단히:

.breadcrumbs a::before {
  content: '>';
  margin-left: 8px;
  margin-right: 8px;
}

저는 이 방법을 사용한 적이 있습니다.제 테스트에서 ">"가 옆에 있는 다른 줄로 완벽하게 잘 포장됩니다.

두 가지 방법이 있습니다.

• HTML에서:

  <div class="ics">&#9969;</div>

이로 인해 ⛱가 발생합니다.

• CSS:

  .ics::before {content: "\9969;"}

코드를 하여 HTML 코를용사<div class="ics"></div>

이는 또한 ⛱의 결과를 낳습니다.

여기서 답을 좀 더 완벽하게 하기 위해서입니다.▁▁like는 같은 것을 한다면,content: attr(aria-label);그러면 유니코드 이스케이프를 사용하는 대신 HTML 엔티티를 사용해야 합니다.를 들어, 예들어, 사용을 합니다.
줄 바꿈을 생성합니다.

언급URL : https://stackoverflow.com/questions/190396/adding-html-entities-using-css-content