본문 바로가기

분류 전체보기221

html 기본 문서 만들기 5 - hr 태그로 수평선 긋기 html 기본 문서 만들기 5 - hr 태그로 수평선 긋기 네 안녕하세요, 이번 포스팅에서는 수평선을 웹에 표현하는 법을 알려드리도록 하겠습니다. 이 수평선은 우리가 생각보다 많이 쓰게 되는데요, 예를 들자면 한 페이지에 두 개 이상의 색이 존재하는 경우, 그 빈칸에 css를 이용하여 그 색을 채워 넣을 때도 쓰입니다. css에 대한 부분은 나중에 다뤄보도록 하겠고, 이번에는 제일 기본인 수평선을 긋는 것 부터 하도록 하겠습니다. 1. 수평선 긋기 : hr 태그 이용 html 태그를 이용하면 수평선을 그어서 구역을 나눌 수도 있습니다. 보통 대단원의 제목을 쓰고서 머리글과 본문을 나눌 때 사용하곤 합니다. 아니면 네비게이션 바 같은 걸 만들었을 때도 이런 걸 가끔 쓰기도 합니다. 아무래도 이러한 수평선을.. 2023. 3. 1.
html 기본 문서 만들기 4 - p 태그로 문단 나누기 html 기본 문서 만들기 4 - p 태그로 문단 나누기 네 안녕하세요, 이번 포스팅에서는 문단을 나누는 방법을 알아보도록 하겠습니다. 우리가 글을 쓸 때 어떤 부분이 끝나면 새로운 주제를 쓰기 위해서 새로운 문단을 만들죠? 그걸 이번에 웹에서 표현을 해보려고 합니다. 그럼 바로 시작하도록 하겠습니다. 1. 문단 나누기 : p 태그 이용 html 문서를 보게 되면 우리가 책을 보는 것처럼 여러 단락으로 나누어져 있는 걸 볼 수가 있습니다. 바로 이 단락을 나누는 태그가 p 태그입니다. 그리고 여기에 css 스타일을 적용을 하면 들여 쓰기와 내어 쓰기 등도 제어가 가능합니다. 하지만 지금은 기본적인 부분들을 배우고 있기 때문에 css에 대한 설명을 드릴 때 제가 이야기를 하도록 하겠습니다 그럼 예제 코드를.. 2023. 2. 28.
html 기본 문서 만들기 3 - title 속성으로 툴팁 달기 html 기본 문서 만들기 3 - title 속성으로 툴팁 달기 네 안녕하세요, 이번 포스팅에서는 툴팁을 다는 것을 한 번 해보도록 하겠습니다. 툴팁은 아주 중요한 요소들은 아니지만, 여러분이 만드는 웹사이트가 백과사전 관련이나, 무언가를 설명해야 하는 사이트라면 반드시 필요한 요소가 됩니다. 그래서 뺄 수는 없는 요소라서 알려드리고자 합니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 툴팁 달기 : title 속성 이용 툴팁은 쉽게 말해서 설명문입니다. 우리가 마우스 커서를 특정 글이나 사진 등에 올렸을 때 작은 창이 하나 뜨면서 어떤 문구가 적혀있는 걸 본 적이 있죠? 그게 바로 툴팁입니다. 주로 나무위키 같은 백과사전처럼 설명을 하는 사이트들에 많이 있습니다. 그리고 이 툴팁은 title 속성을 이.. 2023. 2. 28.
html 기본 문서 만들기 2 - h 태그로 문단의 제목(장, 절, 소제목, etc...) 달기 html 기본 문서 만들기 2 - h 태그로 문단의 제목(장, 절, 소제목, etc...) 달기 네 안녕하세요, 이번 포스팅에서는 페이지 내에 뜨는 화면에 제목을 붙이는 방법을 알아보도록 하겠습니다. 전체 페이지의 기본 폰트를 조절해서 구분감을 주는 요소입니다. 그럼 시작하도록 하겠습니다. 1. 문단의 제목(장, 절, 소제목 등) 달기 : h1 ~ h6 태그 이용 이번에는 문단의 제목을 다는 방법에 대하여 볼 겁니다. 우리가 일반적으로 문서 등을 작성하게 되면 장이나 절마다 소제목을 붙여서 표시를 하죠? html 태그에서는 이 소제목을 사이즈에 따라서 체계회 할 수 있게 하는 태그를 지원을 해줍니다. 바로 태그를 이용을 하는데, 그냥 만 쓰는 게 아니라 과 같이 숫자를 써서 나타냅니다. 이렇게 까지 만들.. 2023. 2. 28.