선택된 인용 배경색

안녕하세요!
인용문에서 텍스트의 선택된 부분에 배경색을 설정하는 CSS 코드 예시를 알려주세요.
아래는 예시입니다:

제 사이트에서는 인용문의 강조된 부분에 배경색이 없는데, 직접 CSS를 조정해 보았지만 성공하지 못했습니다 :pensive:

안녕하세요,

이 가이드를 사용하면 쉽게 확인할 수 있습니다:

이 가이드가 앞으로 도움이 될 것입니다.

요청하신 내용에 대해, 이 특정 부분을 변경하기 위한 코드는 다음과 같습니다. 기본 값을 원하는 색상으로 교체하면 됩니다. :slight_smile:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

span.highlighted가 포럼의 다른 부분에서도 사용된다고 생각하여 .cooked 선택자를 추가했습니다.

@Canapin 님 안녕하세요 :wave:, 이 게시물은 읽었습니다만, 내용이 다소 표면적으로만 다뤄져 있습니다. 이미 님처럼 코드를 붙여넣어 보았지만, 첫 번째 인용문에만 적용되고 이후의 인용문들은 배경색이 변경되지 않습니다(

@Aizada_M 이게 도움이 될지 확신은 없지만, 이렇게 사용해 볼 수 있습니다…

이 플러그인을 사용하면 Composer에서 선택한 텍스트에 다양한 글자 색과 배경색을 적용하는 버튼을 사용할 수 있습니다… Composer에서 생성되는 코드는 다음과 같은 형태입니다…

[wrap=yellow color=green bgcolor=red]
[quote="system, post:1, topic:3, full:true"]Create topics here that don’t fit into any other existing category.[/quote]
[/wrap]

[wrap=yellow color=green bgcolor=red]Create topics here that don’t fit into any other existing category.[/wrap]

(다만 "wrap=color"가 정확히 어떤 역할을 하는지는 잘 모르겠습니다)


사이트의 모든 인용 블록(quote block)에 배경색을 설정하고 싶다면 다음 CSS를 사용할 수 있습니다…

aside.quote .title,
blockquote {
background-color: yellow;
}

혹시 제가 정확히 무엇을 요청하셨는지 잘못 이해한 걸까요?

제 CSS는 여러 개의 인용문에 정상적으로 작동하거든요 :

맞게 이해했어요. 그런데 왜인지 첫 번째 인용구에만 색상이 있고, 그 뒤의 인용구들은 없네요 :man_shrugging:

다른 인용구에서 기본적으로 강조된 부분이 있는 것이 맞나요?
첫 번째 게시물에서 하셨던 것처럼 동영상을 녹화해 주실 수 있을까요? :slight_smile:

답변해 주셔서 감사합니다 :raised_hands:, 매우 유용한 정보를 공유해 주셨네요. 다른 작업을 위해 해당 코드를 저장해 두었지만, 인용할 때 인용된 텍스트의 선택된 부분이 전체 배경과 구별되도록 배경이 강조되기를 원합니다.

일반적인 접힌 상태에서는 인용문의 배경이 강조되지 않습니다. :arrow_down_small: 버튼을 클릭하면 전체 텍스트가 확장되며, 이때 인용된 부분의 배경만 다른 색상으로 강조됩니다.
예를 들어 다음과 같은 형태입니다:

확장된 인용문의 유형:

네, 각 인용문을 강조 표시했는데, 어째서인지 첫 번째 인용문만 선택된 텍스트의 배경색이 변경됩니다. 내일 영상을 촬영해서 여기에 올리겠습니다.

안녕하세요!
제 테마 CSS에 붙여 넣은 코드입니다:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

다음과 같이 작동합니다:

이제 이해한 것 같습니다.

인용된 불릿 목록이 다소 엉망이 됩니다:

첫 번째 인용에서는 불릿의 텍스트만 인용합니다.

두 번째에서는 불릿 자체도 선택하게 되는데, 이렇게 하면 전체 인용을 표시할 때 불릿이 수정됩니다. 불릿은 원래 들여쓰기 위치에서 상위 레벨로 올라가 원래 인용과 일치하지 않으므로, 하이라이트가 표시되지 않습니다.

제 CSS와는 아무런 관련이 없습니다. 어떤 경우에도 하이라이트를 받을 수 없습니다. :slight_smile:

감사합니다 :raised_hands:! 제가 이해한 바로는 이 문제에 대한 해결책이 없습니다. :pensive:

네, 그런 것은 없으며, 제가 링크한 #contribute:bug를 수정한다고 해서 이 특정 문제가 해결될지 저도 확신이 서지 않습니다.