css정리 2

[css]style 적용 우선순위

오늘은 css를 작성했을 때, 스타일이 적용되는 우선순위에 대해 정리해볼게요. 작업할 때 이런 규칙에 대해 알고 있어야 css내에서 충돌이 나지않습니다. 작업을 하다 보면 하나의 태그에 여러 가지 스타일을 주는 경우가 있는데, 이때 특정한 규칙에 따라 우선순위가 부여되는 것입니다. 순서 대로 나열해 보자면, ⭐️우선순위⭐️ 속성 값 뒤에! important를 붙인 속성 html 내에 style을 직접 지정한 속성 #id로 지정한 속성 .클래스, :추상클래스로 지정한 속성 (추상 클래스> 클래스) 태그 이름으로 지정한 속성 상위 객체에 의해 상속된 속성 이 순서입니다. 만약 모든 순서가 다 같다면 제일 나중에 선언된 스타일이 적용됩니다.

html,css 2021.12.09

[css] float 정렬

css로 정렬시키는 방법이 여러 가지 있는데, 오늘은 float에 대해서 정리해볼게요. float만의 특징이 있기 때문에, 조심해서 사용해야 합니다. 단어의 뜻 그대로 '뜨다'라는 성질이 있기 때문에 태그들이 나란히 있다가 그중 하나가 float 속성이 들어가면, 그 사이에서 붕 뜨게 됩니다. display:block 속성을 무시하는 거죠 float는 left 정렬과 right 정렬이 있는데 (inherit, none 제외) float이 설정된 요소는 브라우저가 높이를 인지를 못하는 큰 문제점이 있습니다. 이때 float 끊기라는 것을 해주면 되는데, 여러 가지 방법이 있습니다. float의 부모에게 강제적으로 높잇값 주기 -> 반응형일때 자동 높이값 설정 불가능 float의 부모에게 overflow:h..

html,css 2021.12.06
728x90
반응형