간단하게 자주 사용하는 css 선택기
여기 HTML 코드 먼저 할게요.
1 <div id="div" class="div">
2 <p class="div_P1">p>
3 <span>span>
4 div>먼저 우리의 간단한 선택기를 살펴보자. id와class를 위주로 하고 그 다음에 속성 어댑터와 라벨 등이 있다. 그러나 이런 것들은 모두 자주 사용하지 않는다.
이것은 우리가 예를 들어 말하지 않아도 모두가 할 수 있다
관계선택기에서 하는 말: 자대, 형제 등이 존재하고 간단하게 예를 들면
.div>sapn{ // .div span
color:red;
}
.div sapn{ // .div span
color:red;
}
.div>span,.div>.div_p1{ // .div span .div_p1
color:red;
}
p+sapn{ // p span
color:red;
}그리고 우리의 위조 선택기, 간단하게 몇 가지:
span:hover // a ，
{color:red; }
span:after // span haha
{ content:"haha"; }
span:before // span haha
{ content:"haha"; }
.div span:nth-child(1) // div , { color:red; }
.div span:nth-type-of(1) // div （ span ） , { color:red; }
.div:not(.div_P1){ // div .div_P1 color:red; }그리고 바로 우리의 속성 선택기: 여기는 더 이상 말하지 않겠습니다. 자주 사용하지 않습니다.
마지막으로 권중 문제가 하나 더 있습니다. 권중이면 줄에 삽입된 권중이 가장 높습니다. 그 다음은 id이고 그 다음은class...잠깐만, 이 세 개의 앞쪽을 기억하면 돼.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
