보라코딩

Day47_230306_CSS 본문

코딩/HTML5, CSS3, JS

Day47_230306_CSS

new 보라 2023. 3. 6. 18:05

W3 School 이용해서 CSS 계속 배우는 중...

 

 

 

 

 

부모는 relative

자식은 absolute로 설정시

부모 이동하면 자식도 같이 이동한다.

 

 

 

 

동시에 id와 class 속성을 변경했을때

id가 이긴다!!!

(가중치가 다르다)

 

 

 

 

 

.red가 위에 있지만

class가 태그명보다 가중치가 더 크기 때문에

적용된다.

 

원래 같은 조건이라면

제일 아래 것이 적용된다.

 

 

 

 

p태그보다

div>p 태그가 더 가중치가 크다!

 

 

 

이렇게 둘다 p이면 아래것으로 적용된다.

 

 

 

 

 

 

 

 

 

 

또는 css를 링크로 따로 파일 만들어서 적용하는 방법이 있다.

 

 

 

 

 

 

div 스타일 적용할때 4개 적용하면

상 우 하 좌 (시계방향)

 

 

 

 

 

 

 

 

 

 

 

 

기본은 box-sizing : content-box 인데

이렇게 하면 border과 padding 적용할때 크기가 변한다.

 

그래서 border-box로 적용해놓는 것이 좋다.