반응형
오류 점검 4가지
- 선택자의 논리족 오류 : (class ="description"이라고 클래스 만들고 style시트에. descrptin이라고 설정하는 경우 즉 오타 일경우 )
- 코드를 올바르게 저장했는지 점검 : 저장을 올바르게 하지 않았다 = ctrol+s를 저장 아니면 설정에 들어가서 auto save를 활성하 시켜준다.
- CSS파일이 제대로 연결 되었는지 점검 : 외부 CSS 사용할 때 link태그에 잘 넣어줘야 한다. 내부일 때는 style태그 안에 잘 들어가 있는지 점검 즉 오타 주의
- CSS스타일 우선 순위 : 우선순위를 높여 주면 된다.
CSS 우선 순위 - 웹 페이지에서 스타일이 적용되는 순서를 결정하는 규칙
우선순위
- ! important - 정의되는 CSS의 요소 값 뒤에 위치한다
- inline - 태구 내에 삽입하는 방식을 말함
- id선택자 - #id 명 {안에서 스타일 해준다.}
- class명 - .class명{안에서 스타일해준다.}
- HTML태그명 태그명 그대로 CSS속성을 부여한다.
- DOM구조 상위 상속 - 만약 속성을 주려는 대상 요소에게 아무런 속성도 정의되어 있지 않는다면 기본값은 inherit가 주어지게 되며 이는 상위 요소의 속성을 속상 받는다.
전체 태그
*{
text-align: center;
margin: 0 auto;
padding: 0;
}
class 태그
.header_menu{
background-color: rgb(63, 62, 62);
height: 50px;
}
id태그
#headerSecond_menu{
height: 200px;
border: 1px solid blue;
}
html태그
nav ul{list-style: none;}
dom구조의상위 상속
<div class = "header_menu">안녕하세요 </div>
<body>
인라인
<div style="color: red; ">hellow</div>
</body>
1명 시도 - 2중 요도 - 3 소스 코드
https://play-with.tistory.com/248
CSS 적용 우선순위
CSS 적용 우선순위 CSS 우선순위는 웹 페이지에서 스타일이 적용되는 순서를 결정하는 규칙입니다. 이를 이해하는 것은 CSS를 효과적으로 사용하고 웹 페이지의 스타일을 조절하는 데 매우 중요합
play-with.tistory.com
명시도 에관한 블로그입니다. 이 사이트 들어가서 이해하시길 바랍니다.
반응형
'Web > CSS' 카테고리의 다른 글
블록 레벨 요소 & 인 라인 레벨 요소 , 박스 모델의 기본 구성 (0) | 2024.08.04 |
---|---|
flex Box(개념 -container 적용 되는 속성들 ), 중심축 (0) | 2024.07.29 |
CSS 란 ??? (0) | 2024.07.26 |