less than 1 minute read

CSS란 HTML 웹페이지를 꾸밀 수 있는 언어이다.

HTML이 웹페이지의 구조를 만든다면 CSS는 색상, 크기, 레이아웃을 조정하는 역할을 한다.

- CSS를 관리하는 방법

많은 방법들이 있지만 외부 CSS파일을 만들고 그것을 HTML 문서와 연결시키는 방식이 가장 효율적이다.

이유는 CSS는 바꿀 일이 굉장히 잦다. HTML 코드와 결합시키면 코드가 매우 길어지고 지저분해지므로 나중에 수정할 때 힘들어지는 경우가 발생한다.

그러므로 CSS파일을 따로 관리해야 나중에 수정이 용이하다.

1. 테이블 변경

필자는 테이블을 둥글게 하고싶어서 border-radius: 10px을 설정했다.

table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

2. 제목 가운데 정렬

h1 {
    color: black;
    text-align: center;
}

h1에 속하는 글자를 태그 안의 텍스트를 가운데 정렬했다.

3. 배경색 & 글자색 변경

body {
    background-color: #f8f8f8;
    color: black;
}

f8f8f8은 연한 회색이다.

전체 페이지의 배경색을 연한 회색으로 설정하는 코드이고 기본 글자색은 검은색으로 설정했다.

https://snagjincha.github.io/

변경 사항은 위의 주소에서 확인 가능하다.

Updated: