CSS에서 ID 선택기를 사용하는 방법

할 수있다 4, 2024

마지막 몇 가지 자습서에서는 세 가지 유형의 CSS 규칙 중 두 가지에 대해 설명했습니다. 첫 번째 유형은 일치하는 HTML 태그의 스타일을 기반으로하고 제어하는 HTML 선택기입니다. 두 번째 유형은 웹 페이지의 모든 요소에 적용 할 수있는 일반 스타일처럼 작동하는 클래스 선택기입니다.

이제 ID 선택기라고하는 세 번째 유형의 CSS 규칙에 대해 논의 할 차례입니다. 클래스 선택기와 마찬가지로 ID 선택기는 웹 페이지의 모든 요소에 적용 할 수 있습니다. 그러나 한 페이지에서 한 번만 사용해야합니다. 따라서 ID 선택기는 동적 HTML 및 JavaScript에 매우 유용합니다. 이론적으로, 페이지에서 ID 선택기를 두 번 이상 사용하는 경우 웹 브라우저에서 후속 선택기를 무시해야합니다. 그러나 항상 그런 것은 아닙니다. 웹 브라우저의 예측 가능성에 의존하는 것은 매우 어렵습니다. 따라서 ID 선택기를 사용하도록 선택할 때는 한 번만 사용하십시오. 예를 살펴 보겠습니다.

기본 코드

. . .

예

. . .

ID 선택기

태그 내에서 ID 선택기는 해시 기호 (#)로 시작하고 그 뒤에 ID 선택기에 할당 한 이름이 표시됩니다. 클래스 선택기와 마찬가지로 원하는 이름을 사용할 수 있지만 이름이 ID 선택기에 사용될 이름을 나타내는 것이 가장 좋습니다. 이 예에서는 특수 텍스트 섹션을 식별하는 데 사용합니다.

{자산 가치;}

또한 태그 내부에서 ID 선택기 뒤에는 중괄호 사이에있는 하나 이상의 속성 값 쌍이옵니다. 이러한 속성 값 쌍은 스타일의 특성을 설정합니다. 이 예에서 special_text ID 선택기가있는 단락은 빨간색으로 표시됩니다.

. . .

웹 페이지 본문에서 ID 선택기를 사용하면 여는 HTML 태그 내에서 id 속성을 사용합니다. id 속성의 값은 ID 선택기에 지정된 고유 이름 (이 경우 "special_text")입니다. (id = "value") 선택기가 스타일을 적용하려는 HTML 태그 하나에 스타일을 "연결"하는 방법입니다. 위의 예에서 ID 선택기는 하나의 내부에만 배치됩니다.

웹 페이지에 태그를 추가하십시오. 웹 페이지의 다른 HTML 태그는 여는 태그 안에 ID 선택기를 포함해서는 안됩니다.

비디오 지침: CSS 수업 - 선택자의종류 1 : 아이디선택자 (할 수있다 2024).

CSS에서 ID 선택기를 사용하는 방법, HTML, CSS 규칙 유형, ID 선택기를 사용하는 방법, CSS ID 선택기

이전 기사

다음 기사

메가맨 4-NES

할 수있다 2024

Megaman 4에서이 시리즈는 더 많은 로봇을 추가하고 그래픽을 다시 향상시킵니다. Wily 박사에 의해 연료가 공급되는 산업용 로봇이 충격을 받고 있습니다. 닥터 라이트는 친구 락을 전투 로봇으로 개조했습니다. 이 업데이트에서는 맵, 시간 경과 및 게임 플레이에 대한 기타 세부 정보가 제공됩니다. 원으로 슬라이드하거나 오른쪽으로 점프 할 수...

컴퓨터

레이저 프린터 청소 및 유지 보수 팁

할 수있다 2024

레이저 프린터의 유지 관리는 컴퓨터 유지 관리만큼이나 중요하지만 간과되는 경우가 많습니다. 올바르게 유지 관리되는 레이저 프린터는 더 나은 인쇄 품질과 수년간의 서비스를 제공합니다. 몇 번의 짧은 절차와 최소한의 시간으로 깨끗하고 유지 관리가 잘 된 프린터는 멀리 떨어져 있지 않습니다. 레이저 프린터의 유지 보수 절차는 매월 수행해야합니다. 이 절차는...