CSS 의사 요소에 여러 줄의 텍스트를 삽입하는 방법은 무엇입니까?

의사 요소에 여러 줄 텍스트 삽입

CSS 수정을 통해서만 웹페이지 콘텐츠를 수정할 때 여러 줄의 텍스트를 통합해야 할 수도 있습니다. - 의사 요소 ::after 또는 ::before에 텍스트를 줄입니다. 이 컨텍스트에서는 전통적인 HTML 줄 바꿈이 지원되지 않지만 이스케이프 시퀀스를 활용하는 것이 해결책을 제공합니다.

해결책

CSS 콘텐츠 속성을 사용하면 다음과 같은 방법으로 줄 바꿈을 포함할 수 있습니다. 콘텐츠 문자열에 "A" 이스케이프 시퀀스를 포함합니다. 그러나 결과 줄바꿈에는 'white-space' 속성이 적용됩니다. 따라서 여러 줄 형식을 유지하려면 'white-space: pre;'를 설정하는 것이 중요합니다. 또는 '공백: 사전 포장;'.

예:

#headerAgentInfoDetailsPhone::after {
  content: "Office: XXXXX \A Mobile: YYYYY ";
  white-space: pre; /* or pre-wrap */
}

권장사항

향상된 상호 호환성을 위해 유니코드 줄 바꿈을 처리할 때 "A" 대신 "0000a" 시퀀스를 활용하는 것이 좋습니다. 이 접근 방식은 잠재적인 문자열 조작 불확실성 속에서도 정확한 줄 바꿈을 보장합니다.

위 내용은 CSS 의사 요소에 여러 줄의 텍스트를 삽입하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!