본문 바로가기

분류 전체보기221

css 박스 모델의 구성 알아보기(콘텐츠, 패딩(padding), 테두리(border), 여백(margin) css 박스 모델의 구성 알아보기(콘텐츠, 패딩(padding), 테두리(border), 여백(margin) 네 안녕하세요, 이번 포스팅에서는 css로 다루는 모델 중 하나인 박스 모델에 대하여 알아보도록 하겠습니다. html은 사실 여러 개의 박스가 모여 하나의 웹 페이지를 만든다고 봐도 이상하지 않습니다. 그 이유는 본문을 이루는 body 태그 안에 있는 div 태그가 바로 블록 박스 태그이기 때문입니다. 그래서 이번 포스팅에서는 이러한 블록 박스 모델을 어떤 식으로 구성을 하고 있는지에 대하여 알아보도록 하겠습니다. 그럼 지금부터 같이 보시죠. 1. html 태그를 다루는 방법 html 태그는 사각형의 박스로 이루어져 있습니다. 그래서 앞서 말씀드린 것처럼 html은 여러 개의 블록 박스 구역으로 .. 2023. 3. 18.
css font 프로퍼티 이용하여 모든 프로퍼티 속성 한 번에 사용하기 css font 프로퍼티 이용하여 모든 프로퍼티 속성 한 번에 사용하기 네 안녕하세요, 이번 포스팅에서는 저번 시간에 알려드렸던 폰트 사용법을 좀 더 쉽게 활용하는 방법에 대하여 알아보도록 하겠습니다. 폰트의 사용법을 알고 계시다는 전제 하에 진행을 할 예정이니, 폰트 사용법에 대하여 모르시는 분들이라면 이전 포스팅을 먼저 보고 와주시면 좀 더 도움이 되실 겁니다. 사이트는 아래에 달아두도록 하겠습니다. 2023.03.13 - [html, css, 자바스크립트] - css 폰트 사용법에 대하여 알아보기 그럼 지금부터 시작하도록 하겠습니다. 1. 단축 프로퍼티 사용하기 : font 프로퍼티 이용 단축 프로퍼티인 font 프로퍼티는 font 속성 프로퍼티를 한 번에 쓸 수 있도록 해주는 프로퍼티입니다. 이 .. 2023. 3. 18.
css 폰트 사용법에 대하여 알아보기 css 폰트 사용법에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 폰트를 사용하는 방법에 대하여 알아보도록 하겠습니다. 폰트는 우리가 사용하는 글꼴을 결정짓는 요소인 만큼, 글의 분위기나 독자가 느끼는 감정 등을 좌지우지하기 때문에 중요합니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 폰트 사용하기 : Serif, Sans-Serif, Monospace css에서 폰트는 우리가 평소에 컴퓨터에서 사용하는 여러 가지의 글씨체와 똑같습니다. 그리고 예전에는 라는 태그를 써서 폰트를 입력했는데, 요즘에는 css에서 폰트 프로퍼티를 이용해서 폰트를 입력을 하게끔 만들었습니다. 오히려 미리 css 스타일 시트를 이용하여 선언을 하고 들어가니 좀 더 편해진 셈입니다. 그리고 css에서 폰트를 되게 다양하게 .. 2023. 3. 13.
css 표준 단위에 대하여 알아보기 css 표준 단위에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 css에서 사용을 하는 표준 단위에 대하여 알아보도록 하겠습니다. 아무래도 우리가 직접 쓰는 프로그래밍 언어이기 때문에 그 표준 단위를 모르고 쓸 수는 없어서 한 번 작성을 해보기로 했습니다. 그럼 지금부터 시작하도록 하겠습니다. 1. css의 표준 단위 우리가 css로 스타일 시트를 작성을 하다 보면 사이즈를 적절한 비율로 조절을 하여 구성을 해야만 합니다. 그렇지 않으면 css로 만들어낸 것들이 다 뒤죽박죽이 되어버리고, 오히려 css로 인해서 엉망이 될 수도 있습니다. 그렇기 때문에 단위의 지정은 정말 중요하다고 할 수가 있습니다. 그래서 제가 주로 많이 사용하는 css의 표준 단위를 표로 한 번 정리를 해봤습니다. 단위 의미 사.. 2023. 3. 13.

티스토리툴바