CSS의 의사 클래스 및 의사 요소: 이후

이 글에서는 CSS의 :after pseudo-class와 pseudo-element를 주로 소개합니다. 이제는 필요한 친구들이 참고할 수 있도록 공유하겠습니다.

CSS에는 몇 가지 특별한 속성이 있습니다. 그 중 가장 일반적으로 사용되는 의사 링크는 link, :visited, :hover, :active 등입니다. 이 기사에서는 after의 사용법을 자세히 소개합니다. 아마도 도움이 될 것입니다.

CSS에는 의사 클래스(pseudo-class)라고 불리는 몇 가지 특별한 속성이 있습니다. 그중 가장 일반적으로 사용되는 것은 pseudo-:link, :visited, :hover, :active 등입니다. 링크를 정의합니다.
이 외에도 :focus, :first-child, :lang 등 일반적으로 사용되지 않는 의사 클래스도 있습니다.

그리고 CSS에는 의사 클래스뿐만 아니라 :first-letter, :first-line, :before 및 :after와 같은 의사 요소도 있습니다.
이 기사의 다른 의사 요소는 당분간 나열되지 않습니다. 의사 요소 이후에 대해서만 이야기하겠습니다.
After는 이름에서 알 수 있듯이 요소 뒤에 콘텐츠를 추가하는 것이 본질입니다.
이 의사 요소를 사용하면 생산자가 생성된 콘텐츠를 요소 콘텐츠 끝에 삽입할 수 있으며, 개체 뒤에 발생하는 콘텐츠를 설정하려면 콘텐츠 속성과 함께 사용해야 합니다. 기본적으로 이 의사 요소는 인라인이지만 표시 속성을 사용하여 변경할 수 있습니다.
모든 주요 브라우저는 :after 의사 요소를 지원하지만 IE의 경우 IE8 이상에서만 지원됩니다. css 다음은 CSS 코드에
을 삽입하는 예입니다. 코드는 다음과 같습니다. 제목 내용. 이것이 의사 요소인 :after가 하는 일입니다.
:다음 의사 클래스의 내용 뒤에는 다른 매개변수가 올 수도 있습니다. 1: String

예:

코드는 다음과 같습니다.

<style type="text/css"> 
h1:after {content:url(logo.gif)} 
</style> <h1>标题内容</h1>

2: attr(x) attr은 이름에서 알 수 있듯이 이 유형의 노드의 속성을 읽는 것입니다. 예:

코드는 다음과 같습니다.

<style type="text/css"> 
.test:after{content:"测试代码"}; 
</style> 
<p class="test">测试p：</p>
运行结果显示为：
测试p：测试代码

3: 고정 매개변수CSS의 상속 속성

close-quote: 따옴표 속성의 소인 삽입

no -close-quote: 따옴표 속성 뒤에 태그를 삽입하지 마세요. 하지만 중첩 수준을 높이세요.
open-quote: 따옴표 속성의 사전 태그를 삽입하세요.

no-open-quote: 따옴표 속성의 사전 태그를 삽입하지 마세요. 하지만 중첩 수준을 줄이세요

관련 권장 사항:

위 내용은 CSS의 의사 클래스 및 의사 요소: 이후의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!