목록부트캠프 #코딩 #개발일지 #프론트엔드 #CSS #TIL (1)

나의 개발일지

3. 생활코딩으로 CSS 배우기 (3) - 박스모델 써먹기

그럴듯한 웹페이지처럼 보이기 위해 디자인 하기 1 . border-bottom을 이용하여 밑줄 긋기 2. margin과 padding을 이용해서 간격 조정하기 (*개발자 도구 이용하여 어떤 값을 조정할지 파악) 의 간격이 알맞게 조정되었다 3. 태그에 border-right을 이용하여 목록 분류하기 ol { border-right: 1px solid gray; } 이렇게만 하면 오른쪽 맨 끝에 테두리가 생기는 걸 볼 수 있는데 원래의 기획대로 목록 바로 옆에 두고 싶다면 width 를 이용하여 태그 크기를 지정하면 된다. ol { border-right: 1px solid gray; width: 100px; } 짜잔~ 4. 테두리와 테두리 사이의 간격 없애기 개발자도구를 이용하여 어떤 것 때문에 여백이 ..
CSS/생활코딩 2023. 10. 3. 21:26
이전 Prev 1 Next 다음