CSS의 "::before"는 "before..."를 의미합니다. 의사 요소를 생성하고 선택한 요소의 첫 번째 하위 요소로 설정하고 요소에 삽입하는 데 사용되는 의사 요소입니다. 다른 콘텐츠의 경우 구문은 "element::before{style code}"입니다.
이 튜토리얼의 운영 환경: Windows 10 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
CSS에서 ::before는 무엇을 의미하나요?
Css에서 ::before는 생성된 콘텐츠 요소를 나타내고 해당 요소의 추상화 가능한 스타일의 첫 번째 하위 요소를 나타내는 의사 클래스 요소입니다. , 즉 : 선택한 요소의 첫 번째 하위 요소입니다.
요소의 다른 콘텐츠 앞에 삽입할 콘텐츠를 삽입하려면 ::before를 사용하고 기본적으로 인라인으로 표시합니다. ::before에는 콘텐츠 값을 지정하는 콘텐츠 속성이 필요합니다.
<p class="test"> 2019/11/29 15:35:51 </p>//在这前面加一个小闹钟的图标就可使用::befor
.test::before { content: url(./1597910280\(1\).png); }
1. 객체 앞에 콘텐츠를 설정하는 데 사용되는 의사 클래스 객체
2 . ::before :before의 작성 방법은
:before는 Css2로 작성되고, ::before는 Css3
:before가 ::before보다 호환성이 좋지만 권장됩니다. H5 개발에 사용하려면 ::before가 더 좋습니다
설명:
1. 의사 클래스 요소는 콘텐츠 속성과 함께 사용해야 합니다
2. 의사 클래스 요소는 CSS 렌더링 레이어에 의해 추가될 수 없습니다. js를 통해 작동됩니다
3. 특수 효과는 일반적으로 다음을 통해 활성화됩니다. hover 의사 클래스 스타일
이건 좀 쓸데없는 것 같아요. 사용해도 되지만.
Pseudo-elements는 DOM 트리에 정의되지 않은 가상 요소입니다. 다른 선택기와 달리 요소를 가장 작은 선택 단위로 사용하지 않고 요소의 지정된 내용을 선택합니다. 예를 들어::before는 선택한 요소 이전의 내용을 의미합니다. 즉, ""는 선택한 요소의 선택한 내용을 의미합니다. CSS 의사 요소는 특정 선택기에 특수 효과를 설정하는 데 사용됩니다. 문법적 차이
3) 의사 클래스/의사 요소 목록::
开头。但因为历史原因,浏览器对以:
开头的伪元素也继续支持,但建议规范书写为::
1 | :hover | |
1 | :link | |
1 | :visited | |
1 | :first -아이 | |
2 | :lang | |
2 | :focus | |
1 선택한 요소 | 3 | |
현재 앵커 요소를 선택하세요 | 3 | |
8c24461b7c37b7473ccd94eef61ef4e6 | ||
select 요소의 첫 번째 단어를 지정합니다 | 1 | |
지정된 요소의 첫 번째 줄을 선택합니다 | 1 |
2
지정된 요소의 내용 앞에 내용을 삽입 | 2 | |
지정된 요소에서 사용자가 선택한 내용을 선택 | 3 | |
위 내용은 CSS에서 ::before는 무엇을 의미하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!