월횽

안녕하세요! 진로 상담 및 강연을 하는 월횽(박진형)입니다. 오늘은 Iframe 수업을 진행할 예정입니다. Iframe이 무엇인지, 어떻게 사용하는지 예제를 통해 살펴보겠습니다. Iframe이란? Iframe은 웹페이지의 HTML 코드 안에 다른 HTML 페이지를 삽입하는 방법입니다. 또 다른 HTML 프레임을 포함하는 것이기 때문에 인라인 프레임이라고도 합니다. Iframe 사용 방법 Iframe을 사용하려면 HTML 코드에서 다음과 같이 작성합니다: 1. 태그를 사용하여 Iframe을 열어줍니다. 2. src="" 속성에 표시할 웹 페이지의 URL을 넣습니다. 3. 태그로 Iframe을 닫습니다. 예를 들어, https://jast.tistory.com/ 라는 웹 페이지를 표시하려면 다음과 같이 작성..

안녕하세요! "월횽(박진형)"입니다. 오늘은 15강에서 "아이디 속성 (ID Property)"에 대해 알아보려고 합니다. 이전 강의인 [14강 - Class (클래스)]도 함께 확인하시면 도움이 됩니다. 아이디 속성 (ID Property)란? 아이디 속성은 HTML 문서에서 요소에 고유한 ID를 지정하는 것입니다. 게임을 할 때 고유한 게임 ID를 부여받는 것과 비슷합니다. 예를 들어, 코딩 중 특정 부분에 ID를 지정해줄 수 있습니다. 이렇게 하면 이 ID를 사용하여 요소를 식별할 수 있습니다. 아이디 속성 (ID Property)의 용도 아이디 속성은 이후에 배우게 될 CSS나 JavaScript에서 지정된 ID를 사용하여 요소를 수정하거나 꾸밀 수 있습니다. CSS에서는 해시태그(#)를 사용하여..

안녕하세요! "진로상담&진로 강연"을 하는 "월횽(박진형)"입니다. 오늘은 클래스(Class)에 대해 알아보겠습니다. 클래스(Class)란 무엇인가요? 클래스는 HTML 문서에서 요소들을 그룹화하고, 스타일과 속성을 적용하는 데 사용되는 개념입니다. 클래스는 여러 요소를 하나의 그룹으로 묶어 스타일링할 수 있는 방법입니다. 클래스 사용 예시 예를 들어, 다음과 같은 div 태그들이 있다고 가정해보겠습니다. 내용1 내용2 내용3 내용4 이렇게 각각의 div 요소에 클래스 속성을 추가할 수 있습니다. 내용1 내용2 내용3 내용4 이 예제에서는 각각의 div 요소에 1반, 2반, 3반, 4반이라는 클래스를 부여했습니다. 이렇게 하면 나중에 CSS 수업에서 각 클래스에 다른 스타일을 적용할 수 있습니다. 요약 ..

안녕하세요! "진로상담&진로 강연"하는 남자 "월횽(박진형)”입니다. 오늘은 13강 인라인 엘리먼트 (Inline elements)에 대해 배우겠습니다. 혹시 블록 레벨 엘리먼트가 필요하시다면 [12강 - 블록 레벨 엘리먼트] 수업을 확인해주세요! 인라인 엘리먼트란 좌, 우 가로 영역으로 쌓아가는 태그입니다. 이 수업에서는 태그를 사용하여 인라인 엘리먼트를 배워보도록 할게요. 인라인 엘리먼트는 태그를 열어 텍스트를 작성하고, 태그로 마무리합니다. 이렇게 작성한 태그는 옆으로 정렬됩니다. 아래 예시를 함께 확인해볼까요? 내용을 입력해주세요. 위의 예시처럼 편집기에 직접 적용하거나 복사하여 사용하세요. 태그를 적용한 텍스트의 결과가 본문과 같다면 인라인 엘리먼트를 잘 사용한 것입니다. 인라인 엘리먼트와 블록..

안녕하세요. 진로강연하는 월횽입니다. 오늘은 블록 엘리먼트(Blok Elements)에 대해 간단하게 알아보도록 할게요. 블록 레벨 엘리먼트 (Block Level Elements)는 HTML 태그 중 하나로, 웹 페이지에서 블록 단위로 콘텐츠를 배치하는 요소를 말합니다. 이 요소들은 보통 전체 너비를 차지하고, 위에서 아래로 쌓이는 형태로 구성됩니다. 대표적인 블록 레벨 엘리먼트로는 , ~ , , , 등이 있습니다. 이러한 요소들은 페이지의 좌우 공간을 모두 활용하면서 세로로 콘텐츠를 배치합니다. 블록 레벨 엘리먼트의 사용 방법을 이해하기 위해 가장 일반적인 태그를 예시로 들어보겠습니다. 태그를 사용하면 다음과 같은 형태로 콘텐츠를 블록 단위로 정렬할 수 있습니다. 내용1 내용2 내용3 내용4 위 예시..

안녕하세요! "진로상담&진로 강연"하는 남자 "월횽(박진형)”입니다. 오늘은 11강 링크 태그 (Link Tag) 에 대해서 알아보는 시간을 만들게 되었습니다. 오늘 수업도 여러분에게 유익한 수업이 되었으면 좋겠습니다. 그럼 링크 태그에 대해서 알아보겠습니다. 링크 태그란? 링크 태그는 웹 페이지에서 다른 페이지로 연결할 수 있도록 하는 방법입니다. 주로 태그를 사용합니다. 링크 태그는 텍스트나 이미지를 다른 페이지에 연결할 수 있도록 합니다. 텍스트에 링크를 적용하는 방법 텍스트에 링크를 적용하려면 태그를 사용하고, 그 사이에 링크를 설명할 수 있는 텍스트를 넣으면 됩니다. 예를 들어 자스트는 "자스트" 텍스트에 자스트 공식 홈페이지로 이동하는 링크를 적용한 것입니다. 자스트 이미지에 링크를 적용하는 ..

안녕하세요! "진로상담&진로 강연"을 하는 남자 "월횽(박진형)”입니다. 오늘은 주석 태그에 대해 알아보려고 합니다. 주석 태그 (Comment Tag)란? · 주석 태그는 웹사이트에서 다른 사람들에게 보여주고 싶지 않은 부분을 숨길 때 사용되는 태그입니다. · 웹사이트에 코딩을 통해 다른 사람들이 볼 수 없게 만드는 역할을 합니다. 주석 태그 사용법 · 주석 태그 사용법은 간단합니다. · 보여주고 싶지 않은 부분의 시작에 표시를 합니다. 예시 안녕하세요. 오늘은 주석 태그에 대해 알아보려고 합니다. · 위 예시에서 사이에 있는 내용은 주석 처리되어 보이지 않습니다. · 주석을 시작할 때, 주석의 목적을 설명하는 메모를 함께 추가하면 나중에 이유를 파악할 수 있습니다. 정리 · 주석 태그는 개인 프로젝트..

안녕하세요! 진로상담과 진로 강연을 하는 "월횽(박진형)"입니다. 오늘은 HTML에서 리스트를 나타내는 태그에 대해 알아보려고 합니다. 이 태그는 웹 개발 시 자주 사용하는 중요한 요소 중 하나입니다. 리스트를 나타내는 태그란? 리스트를 나타내는 태그는 웹 페이지에서 목록을 표현할 때 사용하는 태그입니다. 예를 들어, 수업의 목차를 작성할 때 다음과 같은 형식으로 표현할 수 있습니다. 1. 기초 2. 초급 3. 중급 4. 고급 이러한 리스트 목록을 만들 때 사용하는 태그가 , , 태그입니다. 이 태그들은 서로 다른 특징이 있어 각각의 태그에 대해 알아보겠습니다. 태그 • 태그는 리스트의 각 항목을 나타내는 요소입니다. • li 태그는 항상 부모 태그인 또는 안에 포함되어야 합니다. 태그 • 태그는 순서가..

안녕하세요! 강연하는 남자 "월횽"입니다. 오늘은 웹사이트나 블로그에서 이미지 태그 (img tag) 사용법에 대해 알아보겠습니다. 이미지 태그는 텍스트 외에 이미지를 추가하여 페이지를 더 매력적으로 만들고, 사용자 경험을 향상시키는 역할을 합니다. 이미지 태그 사용 방법 이미지 태그를 사용하기 위해서는 우선 이미지 파일을 준비해야 합니다. 예를 들어 아래와 같이 이미지.jpg라는 이미지 파일이 있다고 가정합시다. 이 이미지를 웹사이트에 삽입하기 위해서는 다음과 같은 코드를 사용합니다. 코드 해설 · : src 속성은 이미지 파일의 경로를 지정합니다. 여기서는 수업을 위한 이미지.jpg를 지정했습니다. · alt="...": alt 속성은 이미지의 대체 텍스트를 지정합니다. 이 경우, "월횽"을 입력했습..

안녕하세요! "진로상담&진로 강연"하는 남자 "월횽(박진형)”입니다. 오늘은 HTML에서 줄바꿈 태그 에 대해 알아보는 시간을 가져보겠습니다. 줄바꿈 태그란? 줄바꿈 태그는 문장이 길어질 때 한 문장에서 다음 문장으로 줄을 바꿀 때 사용됩니다. 이는 글을 구성할 때 엔터(Enter)를 눌러서 다음 문단으로 넘어가는 것과 비슷한 역할을 합니다. 줄바꿈 태그는 어떻게 사용하나요? 줄바꿈 태그 는 시작 태그 없이 종료 태그만 사용하여 동작하는 태그입니다. 이는 다른 HTML 태그와는 약간 다른 점입니다. 예시를 통해 줄바꿈 태그를 어떻게 사용하는지 살펴보겠습니다. 안녕하세요. 진로 교육을 진행하는 강연하는 남자 “월횽”입니다. 코딩 수업을 진행하게 되어서 매우 기쁘게 생각하고 있습니다. 위의 예시처럼 줄바꿈이..