웹개발/CSS2 [CSS] CSS 선택자(2)(기본 속성 선택자, 자식 선택자, 자손(후손) 선택자, 인접 형제 선택자, 일반 형제 선택자) 기본 속성 선택자문법 : 태그[속성이름] {}HTML 요소의 속성을 기준으로 스타일을 지정할 수 있는 CSS 기능 [CSS 코드]/* 속성값과 일치하는 태그, 요소 선택 */div[name=name2] { background: orangered;}/* 속성 안의 값이 접두사로 특정 값을 단어로 포함하는 객체 선택 *//* 즉, name1이라는 단어를 포함하고 있는 모든 객체 선택*/div[name~=name1]{ background: yellow;}/* 속성 안의 값이 특정 값으로 끝나는(접미사) 객체 선택 */div[class$=class]{ color: cyan;} [HTML 코드]div 1div 2 div 3 div 4 div1background : yellow, color : cy.. 2025. 4. 14. [CSS] CSS 선택자(1)(전체 선택자, 태그 선택자, 클래스 선택자, ID 선택자) 전체 선택자문법 : * {}모든 태그를 선택할 때 사용문서 전체에 CSS 스타일이 적용된다. * { color: red;}해당 HTML 문서에 있는 모든 글자의 색상을 빨간색으로 지정하는 CSS태그 선택자문법 : 태그이름 {}특정 태그 요소를 선택할 때 사용특정 태그를 가진 객체에만 CSS가 적용된다. p, li { color: blue;}해당 HTML 문서에 있는 모든 p 태그와 li 태그의 텍스트 색상을 파란색으로 지정하는 CSS클래스 선택자문법 : .클래스 이름 {}특정 클래스를 가진 요소에만 CSS가 적용된다. [CSS 코드].class1 { background: gray; color: purple;} [HTML 코드] 클래스 선택자 테스트 2 클래스 선택자 테스트 3 .. 2025. 4. 14. 이전 1 다음
