CSS 적용 우선 순위 : 어려운 말로 CSS 명시도

css를 이용해서 웹 페이지의 스타일이 적용될 때 무작정 적용되는 것은 아니다css가 적용되는 우선순위가 있는데, 이 우선순위에 대해서 무시하고 코드를 작성하다 보면어느 순간 꼬여버린 웹페이지를 발견할 수 있게 될 수 있다. 그래서 이번에는 CSS의 명시도에 대해서 알아보도록 하겠다.  명시도명시도라는 것은 보통 색에서 나타나는 개념인데,둘 이상의 색이 같은 조건에 있을 때, 확실히 보이는 정도를 의미한다.이 의미를 CSS에 적용하다면 같은 요소에 다양한 스타일이 적용될 때, 더 우선적으로 적용되는 스타일이라는내용으로 이해할 수 있겠다. 좀 더 구체적으로 어떤 상황에서 CSS의 명시도에 대한 이해가 있어야 하는지 알아보자. hello world!h1 { color:red;}#title { color:..

• format_list_bulleted Stack/CSS
• · 2024. 11. 4.
• textsms

Box model : 여긴 내 구역이야 XX들아!

지난 포스팅 중 개발자 도구 뜯어먹기 : Elements 편에서 마지막에 Box-model에 대해서 짧게 언급하고 지나갔었다.근데 이게 프론트엔드 면접 질문으로 나올 수도 있다기에 조금 더 정리해 보려고 작성해 본다. 먼저 읽고 오면 좋은 글개발자 도구 뜯어먹기 : Elements Box model기본적으로 박스 모델에 대한 정의를 해보자면 모든 HTML 요소를 이루고 있는 구조다.기본적인 구성은 margin, border, padding, content로 구성이 되어있다. 모든 HTML 요소를 이루고 있는 구조라고 하는 말은 HTML에서 사용한 각 태그마다 이 박스 모델을 가지고 있다는 것을 의미한다.모든 태그가 이 박스 모델을 가지고 있다는 것은 결국 문서의 레이아웃을 구성하기 위함이라고 볼 수 있겠..

• format_list_bulleted Stack/CSS
• · 2024. 10. 21.
• textsms