CSS 선택기 클래스와 ID의 차이점은 무엇입니까? HTML의 id 및 클래스 사용법

CSS 선택기 클래스와 ID의 차이점은 무엇입니까? HTML의 id 및 클래스 사용법

천 웨이량현재 실행 중SEO, 사이트 최적화워드프레스(WordPress)주제.

이전에 몇 가지 기본적인 HTML 및 CSS 지식을 배웠지만 한동안 조작하지 않았고 특히 CSS 부분 사용법을 잊어버리기 쉽습니다.

따라서 여기에 CSS 선택기 ID와 클래스의 차이점과 사용법을 기록하고 요약합니다.

• ID는 #div에 해당합니다.
• 클래스는 .div에 해당합니다.

id와 class의 차이점

아이디 설명

• id는 웹 페이지에서 더 큰 스타일을 정의하는 데 사용되는 고정 태그로 #div 형식으로 정의됩니다.
• 예: 열, 상단, 본문, 하단 등 분할...
• 페이지당 한 번만 나타날 수 있고 반복적으로 호출할 수 없는 특정 요소를 정의하는 데 사용됩니다.

클래스 설명

• 클래스는 웹 페이지에서 세부적인 스타일을 정의하기 위해 사용되는 스타일 그룹으로 .div 형식으로 정의되며 반복될 수 있습니다.
• 예: 특정 메뉴, 텍스트 줄 등...
• 동일한 페이지에서 여러 요소에 의해 반복적으로 호출될 수 있습니다.

div 선택기 자체에는 속성이 없으며 CSS를 정의하여 div의 너비, 높이, 배경색 및 텍스트 크기와 같은 일부 레이아웃을 제어합니다.

일반전자 상거래웹사이트,웹사이트를 구축프로그램에서 생성한 html 웹페이지는 CSS를 통해 페이지 레이아웃을 구현하는 것입니다.

셀렉터란?

각 CSS 스타일의 정의는 두 부분으로 구성됩니다.

选择器 {样式}

• {} 앞의 부분은 "선택기"입니다.
• "선택기"는 그것이 작동하는 {}의 "스타일"을 나타냅니다.
• 즉, 이 "스타일"은 웹 페이지의 어떤 요소에서 작동합니까?

코드 예제

class="sidebar" 요소를 선택하고 스타일을 지정하는 방법은 다음과 같습니다.

.sidebar
{ 
background-color:black;
}

다음은 id="footer"로 요소를 선택하고 스타일을 지정하는 방법입니다.

#footer
{ 
background-color:black;
}