CSS에서 일반적으로 사용되는 선택기에는 클래스 선택기, ID 선택기, 요소 선택기, 하위 선택기, 하위 선택기, 와일드카드 선택기, 그룹 선택기 및 속성 선택기가 포함되며, 특정 요소를 지정하는 데 사용됩니다. 스타일 지정 및 페이지 레이아웃을 위한 그룹입니다.
CSS 공통 선택기
CSS 선택기는 특정 요소나 요소 그룹을 지정하는 데 사용됩니다. 다음은 CSS에서 가장 일반적으로 사용되는 선택기 중 일부입니다.
1. 클래스 선택기
.class-name
.class-name
.red
选择具有 "red" 类的所有元素。2. ID 选择器
#id-name
#header
选择具有 ID 为 "header" 的元素。3. 元素选择器
element-name
p
选择所有段落元素。4. 后代选择器
parent > child
div > p
选择所有在 div 元素内的段落元素。5. 子选择器
parent child
ul li
选择所有在无序列表 (ul) 中的列表项 (li)。6. 通配符选择器
*
* { color: blue; }
将所有元素的文本颜色设置为蓝色。7. 群组选择器
element1, element2, element3
p, h1, h2
选择所有段落、标题 1 和标题 2 元素。8. 属性选择器
[attribute]
或 [attribute=value]
[data-type="nav"]
#id-name
🎜🎜지정된 ID가 있는 요소 선택🎜🎜예: #header
ID가 있는 요소 선택 "헤더"의 요소입니다. 🎜🎜🎜🎜3. 요소 선택기🎜🎜🎜🎜구문: 요소 이름
🎜🎜지정된 요소 이름을 가진 모든 요소를 선택하세요🎜🎜예: p
모든 단락 선택 요소. 🎜🎜🎜🎜4. 하위 항목 선택기🎜🎜🎜🎜구문: parent > child
🎜🎜상위 요소의 하위 요소를 선택합니다.🎜🎜예: div > /code > div 요소 내의 모든 단락 요소를 선택합니다. 🎜🎜🎜🎜5. 하위 선택기🎜🎜🎜🎜구문: <code>상위 하위
🎜🎜상위 요소의 하위 요소인 하위 요소를 선택하세요🎜🎜예: ul li code> 순서가 지정되지 않은 목록(ul)에서 모든 목록 항목(li)을 선택합니다. 🎜🎜🎜🎜6. 와일드카드 선택기🎜🎜🎜🎜구문: <code>*
🎜🎜모든 요소 선택🎜🎜예: * { color: blue }
텍스트 색상은 파란색으로 설정되었습니다. 🎜🎜🎜🎜7. 그룹 선택기 🎜🎜🎜🎜 구문: element1, element2, element3
🎜🎜여러 요소 선택🎜🎜예: p, h1, h2
모두 선택 단락, 제목1 및 제목2 요소입니다. 🎜🎜🎜🎜8. 속성 선택기🎜🎜🎜🎜구문: [attribute]
또는 [attribute=value]
🎜🎜지정된 속성을 선택하거나 속성 값이 지정됩니다. 값 요소 🎜🎜 예: [data-type="nav"]
"data-type" 속성이 있고 해당 값이 "nav"인 모든 요소를 선택합니다. 🎜🎜위 내용은 CSS에서 일반적으로 사용되는 선택자는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!