책 읽다가 코딩하다 죽을래

웹에서 Text를 다루는 속성은 자주 사용하고 중요합니다. 텍스트와 관련된 속성 중에 가장 중요한 것은 폰트(font)와 관련된 속성입니다. 폰트와 관련된 속성은 크게 폰트 종류(font-family), 크기(font-size), 형태(font-style, font-weight)가 있습니다. 일반적으로 font-family를 통해 원하는 폰트의 종류를 지정할 수 있습니다. 보통 한 단어로 구성된 폰트명은 따옴표(,) 없이 사용하지만 띄어쓰기 또는 하이픈(-)이 들어간 폰트명의 경우 따옴표를 사용하여 하나의 폰트명임을 표시해야 합니다. /* ✅ 올바른 한 단어 폰트 이름 */ font-family : Arial; /* ✅ 올바른 한 단어 폰트 이름 */ font-family : 'Arial'; /* ❌ 잘..

2020/03/19 - [html,css] - CSS 박스 모델에 대해 알아보자(Border) CSS 박스 모델에 대해 알아보자(Border) 2020/03/19 - [html,css] - css 박스 모델에 대해 알아보자(박스 모델 개요, Content) css 박스 모델에 대해 알아보자(박스 모델 개요, Content) HTML의 모든 요소들은 모두 공통적으로 box 모델을 갖고 있다. 어.. ablue-1.tistory.com 이 글은 윗 글 다음으로 이어지는 글이므로 윗 글을 읽었다는 전제하에 작성하는 글입니다. 이제 border 밖에 있는 경계선 내부 여백인 padding과 경계선 외부 여백을 margin에 대해서 배워봅시다 padding과 margin은 border처럼 각각 네 방향 또는 한꺼..

2020/03/19 - [html,css] - css 박스 모델에 대해 알아보자(박스 모델 개요, Content) css 박스 모델에 대해 알아보자(박스 모델 개요, Content) HTML의 모든 요소들은 모두 공통적으로 box 모델을 갖고 있다. 어떠한 요소들이 어느 위치에 어느 영역을 차지하여 배치를 시킬려면 css에 박스 모델을 알고 가야 한다. 요번 시간에는 박스 모델에 대해 배우고자.. ablue-1.tistory.com 이 글은 윗 글 다음으로 이어지는 글이므로 윗 글을 읽었다는 전제하에 작성하는 글입니다. 이제 Content에 대해 어느정도 알게 되었으니 이를 감싸는 border에 대해 알아봅시다. 경계선은 크게 세 가지의 속성을 사용합니다. border-style, border-width..

HTML의 모든 요소들은 모두 공통적으로 box 모델을 갖고 있다. 어떠한 요소들이 어느 위치에 어느 영역을 차지하여 배치를 시킬려면 css에 박스 모델을 알고 가야 한다. 요번 시간에는 박스 모델에 대해 배우고자 한다. Hello World 지금 당장 이 코드를 실행시켜보자 실행한 후 ctrl + shift + c 를 누른 후 Hello World 문구에 갖다대보자 그럼 오른쪽 하단에 주황색 박스가 보이는데 이것이 바로 박스모델이다 HTML 자세히 보면 이렇다 HTML의 모든 요소는 이렇게 사각형 박스 형태로 출력된다 이 사각형 박스 안에는 Margin, Border, Padding Contetn라는 4가지 요소가 있다 Content(내용) Content는 Hello World 처럼 박스 모델 내부에 ..