뇌운동일지

[CSS3] 연결 선택자, 속성 선택자 본문

CSS

[CSS3] 연결 선택자, 속성 선택자

purpleduck 2020. 4. 16. 16:17

<연결 선택자 >

 

상위요소 하위요소 { 스타일 정의 } /* 어딘가 밑에 있는 : 자식 손자 모두 해당 */

section ul li ul /* ul 두개 다 되는 것-> 상위요소의 모든 하위요소*/

 

A요소, B요소 { 스타일 정의 }

 

부모요소 > 자식요소 { 스타일 정의 } /* 바로 밑에 있는 : 손자는 해당안됨 */

section> /*손자는 해당되지 않고, 자식만 해당*/

 

요소+요소 {  }

h1 + p {  } /* hi와 p가 같이 있을 때, p에만 해당 : hi다음에 오는 첫번째 p에만 해당 */

p hi p 

 

요소 ~ 요소 {  }

hi ~ p {  } /* 모든 형제 : hi다음에 오는 모든 p*/

 

----------------------------------------------------------------------------------

< 속성 선택자 >

 

[속성=값]

a[href] /*a태그 중에 href 속성을 갖는 것들은 ~ */

 

[속성=값]

[속성~=값]

 

ms 밀리초

s 초 

시간을 지정해야 부드럽게 바뀐다.

'CSS' 카테고리의 다른 글

[CSS3] CSS 박스 모델  (0) 2020.04.13
[CSS3] 색상, 배경  (0) 2020.04.09
[CSS3] CSS기초지식  (0) 2020.04.08
Comments