기초 웹 프로그래밍 9주차 HTML5 1학년 과제(제출일자: 2026년 5월 10일 부터 5월 11일 까지)

제출일자 : 2026년 5월 10일 ~ 5월 11일  

HTML5 1학년 과제 5월 10일~5월 11일 숙제 제출.hwp

0.16MB

과제 1)

 

Edit 은 여기서 편집기라는 의미니,  html 편집기( 예: 메모장(Windows Notepad), Notepad++, HTML online editor) 사이트에 쓰면 됩니다.

원래 Editor라고 불러야 더 직관적인데 그냥 하죠

 

저는 메모장(Windows Notepad)을 쓸 겁니다. 일단 여러 가지 골고루 써서 고객인 척하는 것보다는 하나라도 아껴써서 사용자가 되는게 나은 것 같아서요

일단 여기 메모장(Windows Notepad) 키고 해보겠습니다.

 

제가 메모장(Windows Notepad) 화면을 최소로 씁니다.

저는 이런 것을 최소 창이라고 부릅니다.

최소 창을 쓸 때는 2가지 장점과, 1가지 단점이 있습니다. 2가지 장점으로는 첫번째는 렉을 줄이는 용도입니다. 두번째는 최소 창으로 해서 특히 옆 부분에 생기는 직사각형 광고를 안 보는 용도로도 쓰입니다.(단 어떤 곳은 웹 화면 확대축소 비율 100% 만 되는 곳도 있습니다.), 단점으로는 일부 기능 버튼을 최소 창으로 할 때 안 나타나는 현상이 있습니다.

이 상태에서 저 네모 버튼을 마우스로 누르면

 

전체 화면으로 됩니다. 이제 해봅시다. 여기서 먼저  과제 1)  HTML 코드를 작성합시다.

 

여기서 저장부터 합시다. 먼저 파일 버튼을 누르면

 

 

그 다음에 저장 버튼 누릅시다.

 

그 다음에 제 컴퓨터에서는 이렇게 나옵니다.

 

다른 컴퓨터는 모르겠지만 나중에 저 혼자 PC 방이나 공용 컴퓨터에서 저장할 때 어떻게 뜨는지 확인할 겁니다.

 

일단 바탕 화면으로 뜨게  "바탕 화면"  버튼을 눌러 지정합시다.

 

 

파일 이름(N):   옆에 !DOCTYPE html 을   button.html 로 바꿔줍시다. 

 

 

 

밑의 사진처럼 바꾸면 됩니다.

 

이제    저장(S)     눌러줍시다. 

 

이제 바탕 화면으로 갑시다.

 

저쪽 왼쪽에 button 이라고 써진 거 빠르게 더블 클릭하여 눌러봅시다.

 

됩니다. 나중에 이렇게

button.html

0.00MB

 

button.html  파일을 이메일로 보내면 됩니다.

 

---

과제 2)   와  과제 3)                      

이거는 Google과 Chrome에서는 "관심 분야" 선택 됨 버튼이 파란색으로 뜹니다. Microsoft Edge 에서는 "관심 분야" 선택 됨 버튼이 회색으로 뜹니다.

 

왜냐하면 <link href="induk.css" type="text/css" rel="stylesheet">  이 있기 때문에,

이건 외부 CSS3 스타일 시트 파일을  이 메모장(Windows Notepad) 파일로 불러올려고 쓰는 겁니다.

 

CSS3 스타일 시트는 제가 나중에 스스로 다 이해하면 여기서 재수정해서 제대로 쓰겠습니다.

 

그러므로  메모장(Windows Notepad)   더 추가하려면 일단 먼저 쓴 다음에 

마우스를 화면 천장 위에 있는 왼쪽 부분에서 저 + 기호를 마우스로 눌러줍시다.

 

그러면 메모장을 더 추가했습니다. 우선 먼저 이름 저장부터 합시다.