CSS CSS의 선택자_두번째 | 속성선택자
작성일 20-11-20 19:16
페이지 정보
작성자디벨로드 조회 907회 댓글 0건본문
속성선택자
태그 안에서 사용하는 속성들의 값에 따라 스타일을 지정할 수 있습니다.[속성] 형식
지정한 속성을 가지고 있는 요소를 찾아 스타일을 적용합니다.선택자
선택자
· 속성 선택자
· 가상클래스 선택자
A 태그 중 href라는 속성이 있는 요소를 찾아내 거기에 배경색을 노란색으로 적용합니다.
[속성 = 값] 형식
주어진 속성과 값이 일치하는 요소를 찾아 스타일을 적용합니다.선택자
선택자
· 속성 선택자
· 가상클래스 선택자
A 태그 중에서 target=“_blank”인 링크, 새 탭으로 열리는 링크에 배경색을 노란색으로 적용합니다.
[속성 ~= 값] 형식
[속성=값] 과 다르게 비교할 값이 여러 개일 경우, 그 중 하나만 일치해도 스타일을 적용합니다.CSS의 선택자
선택자
속성 선택자
가상클래스 선택자
선택자
속성 선택자
가상클래스 선택자
H4 태그 중 title의 값이 “웹아이”인 경우 배경색을 노란색으로 적용합니다.
H4 태그 중 title의 값이 “디벨로드”인 경우 글자에 밑줄을 적용합니다.
title이 “웹아이 디벨로드”인 경우 둘 다 적용합니다.
[속성 ^= 값] 형식
지정한 문자로 시작하는 속성값에 대해서만 스타일을 적용합니다.CSS의 선택자
선택자
속성 선택자
가상클래스 선택자
CSS의 선택자
선택자
속성 선택자
가상클래스 선택자
H4 태그중 title의 값이 “웹아이”로 시작하는 요소에 배경색을 노란색으로 적용합니다.
[속성 $= 값] 형식
지정한 문자로 끝나는 속성에 대해서만 스타일을 적용합니다.CSS3부터 정의되었습니다.
선택자
선택자
· 속성 선택자
· 가상클래스 선택자
A 태그의 href속성 값 중에서 hwp로 끝나면 배경색을 노란색으로 적용합니다.
[속성 |= 값] 형식
속성이 지정한 값으로 시작하면 스타일을 적용합니다.선택자
선택자
· 속성 선택자
· 가상클래스 선택자 A 태그 중 class 속성이 “red”로 시작하면 배경색을 노란색으로 적용합니다.
정확하게 “red”이거나 뒤에 하이픈(-)이 있는 경우에 사용할 수 있습니다.
[속성 *= 값] 형식
속성값이 앞이나 뒤, 또는 중간 등 어느 위치에 있든지 해당값이 포함되어 있으면 스타일이 적용됩니다.선택자
선택자
· 속성 선택자
· 가상클래스 선택자1 · 가상클래스 선택자2 A 태그 중 class의 속성값에 "red"가 포함되어 있으면 배경색을 노란색으로 적용합니다.
이상 스타일 시트의 속성을 이용한 선택자에 대해 알아보았습니다.
추천1
댓글목록
등록된 댓글이 없습니다.