스프링에서 CSS 적용하기 전 정적 리소스 경로 설정을 해줘야한다!(자주 까먹음)
Spring gradle일 때,
spring.mvc.static-path-pattern=/static/**
spring.resources.static-locations=classpath:/static/
spring.resources.add-mapping=true를 추가하여 static에 경로설정
DIV
div는 블록레벨로 한줄의 공간을 다 차지함
<style>
div{ border: 3px solid red;
}
span{
border-width: 5px;
border-style: dashed;
border-color:rgb(100%, 50%, 0%);
}
</style>
</head>
<body>
<div>나는야 블록 레벨</div>
<span>나는야 인라인</span>
</body>
</html>
<style>
div{ border: 3px solid red;
display:inline;} <-- display에 inlie속성 적용하여 블록레벨에서 인라인으로 변경
span{
border-width: 5px;
border-style: dashed;
border-color:rgb(100%, 50%, 0%);
}
</style>
</head>
<body>
<div>나는야 블록 레벨</div>
<span>나는야 인라인</span>
</body>
</html>
display : 요소의 블록 레벨, 인라인 여부를 변경 처리할 수 있다.
- inline : 줄이아닌 태그 공간만큼 차지함
- block : 한 줄을 차지함
- inline-block : 인라인 형태로 보이지만 블록의 속성을 가짐
border : 요소가 차지하는 영역에 테두리를 그릴 수 있다.
Box Model : 하나의 박스는 네개의 영역으로 구성됨
- 콘텐츠 영역
- 안쪽여백
- 경계선(테두리)
- 바깥쪽 여백
어제의 나보다 나은 오늘의 내가 되자!🧗♂️