상세 컨텐츠

본문 제목

HTML5 웹 프로그래밍 입문 3판 연습문제 3장

html 웹 프로그래밍

by ♥북스토리♥ 2022. 5. 9. 13:42

본문

반응형

< Chapter 03 >


(1) h는 ( heading )의 약자입니다. ( 제목 )

(2) p는 ( paragraph )의 약자입니다. ( 단락 )

(3) br은 ( break )의 약자입니다. ( 줄 바꿈 )

(4) hr은 ( horizontal rule )의 약자입니다. ( 수평 줄 )

(5) a는 ( anchor )의 약자입니다.

(6) href는 ( hyper reference )의 약자입니다.

(7) b는 ( bold )의 약자입니다. ( 굵은 글자 )

(8) I는 ( italic )의 약자입니다. ( 기울어진 글자 )

(9) sub는 ( subscript )의 약자입니다. ( 아래 첨자 )

(10) sup는 ( superscript )의 약자입니다. ( 윗 첨자 )

(11) ins는 ( insert )의 약자입니다. ( 밑줄 글자 )

(12) del은 ( delete )의 약자입니다. ( 취소선이 그어진 글자 )

(13) ul은 ( unordered list )의 약자입니다. ( 순서가 없는 목록 생성 )

(14) ol은 ( ordered list )의 약자입니다. ( 순서가 있는 목록 생성 )

(15) li는 ( list item )의 약자입니다. ( 목록요소 생성 )

(16) tr은 ( table row )의 약자입니다. ( 표에 행 삽입 )

(17) th는 ( table heading )의 약자입니다. ( 표의 제목 셀 생성 )

(18) td는 ( table data )의 약자입니다. ( 표의 일반 셀 생성 )

(19) HTML 본문에 공백을 여러 번 넣고 싶을 때는 ( &nbsp; )를 사용합니다.

(20) HTML 본문에 <기호를 넣고 싶을 때는 ( &lt; )를 사용합니다.

(21) HTML 본문에 >기호를 넣고 싶을 때는 ( &gt; )를 사용합니다.

02 다음 질문에 OX를 표시하시오.


(1) h1 태그가 가장 큰 제목 태그고, h6 태그가 가장 작은 제목 태그입니다. ( O )

(2) a 태그의 링크를 지정할 때는 link 속성을 사용합니다. ( O ) < herf 속성을 사용한다 >

(3) 목록은 ul 태그와 ol 내부에 li 태그를 넣어서 만듭니다. ( O )

(4) 목록 내부에 목록을 중첩할 수도 있습니다. ( O )

(5) th 태그와 td 태그의 rowspan 속성과 colspan 속성을 사용하면 마이크로소프트 워드 등 스프레드시트에 있는 셀 병합 기능처럼 테이블의 셀을 병합할 수 있습니다. ( O )

(6) img 태그, audio 태그, video 태그는 모두 텍스트 등 내용물을 가질 수 없습니다 ( X )

(7) audio 태그, vedio 태그에 controls 속성을 지정할 때 표시되는 재생 제어 버튼들은 모든 웹 브라우저에서 모양 형태가 같습니다 ( X ) < 형태가 다르다 >

03 다음 중 이미지의 대체 문자를 지정할 때 사용하는 속성은? ( 3번 alt )

 

① text ② alter ③ alt ④ imgtxt

 

04 다음 중 a 태그로 빈 링크를 만들 때, href 속성에 일반적으로 사용되는 기호는? ( 1번 # )

① # ② @ ③ * ④ +

 

 

05 다음 중 HTML5 표준에 없는 태그는? ( 4번 tcontent )


① table ② tfoot ③ thead ④ tcontent

 

 

06 다음 중 HTML5 표준에 없는 태그는? ( 1번 big )

 

① big ② small ③ b ④ i

 

 

07 다음 중 audio 태그와 video 태그 내부에 넣어 웹 브라우저가 재생 할 수 있는 파일 확장자 관련 문제를 해결할 때 사용하는 태그는? ( 2번 source )

 

① src ② source ③ content ④ media

 

 

08 클릭하면 다음 링크로 이동하는 a 태그를 작성하시오.


(1) 한빛 미디어 웹 사이트 ( http://www.hanbit.co.kr ) ->

<a href="http://www.hanbit.co.kr">한빛미디어 웹 사이트</a>

(2) 네이버 메인 페이지 ( http://www.naver.com ) ->

<a href="http://www.naver.com">네이버 메인 페이지</a>

(3) 구글 메인 페이지 ( http://www.google.com ) ->

<a href="http://www.google.com">구글 메인 페이지</a>

 

09 다음과 같이 폴더를 구성했을 때, 클릭하면 한빛미디어 웹 사이트로 이동하도록 이미지가 포함 된 a 태그를 작성하시오.

<a href="http://www.hanbit.co.kr"><image src="habit.png></a>

10 다음과 같은 웹 페이지를 생성하시오.

10

HMTL5 Basic

ITCookbook - HanbitAcademy


Lorem ipsum dolor sit amet, conesctetur adipiscing elit. Vestibulum suscipit feugiat nisi, vel lacinia magna posuere id. Integer ac tellus diam. Donec feugiat nulla non turpis semper, vel suscipit sapien mollis. Vestibulum dolor tellus, vulputate in turpis vel, auctor consequat justo. Nullam congue justo eget ipsum molis hendrent. Aliquam rutrun gravida eros eget elementum. Suspendisse gravida sem at leo mattis, eu auctor neque iaculis.

<!DOCTYPE html>
<html>
<head>
	<title>10</title>
</head>
<body>
	<h1>HMTL5 Basic</h1>
	<h2>ITCookbook - HanbitAcademy</h2>
	<hr/>
	<p>Lorem ipsum dolor sit amet, conesctetur adipiscing elit.
	   Vestibulum suscipit feugiat nisi, vel lacinia magna posuere id.
	   Integer ac tellus diam. Donec feugiat nulla non turpis semper,
	  vel suscipit sapien mollis. Vestibulum dolor tellus, vulputate in turpis
	vel, auctor consequat justo. Nullam congue justo eget ipsum molis hendrent.
	Aliquam rutrun gravida eros eget elementum. Suspendisse gravida sem at leo mattis,
	eu auctor neque iaculis.</p>
</body>
</hteml>

11 다음 목록을 생성하시오.

  • 따뜻한 음료
    1. 커피
    2. 녹차
    3. 둥글레차
  • 차가운 음료
    1. 커피
    2. 스무디
    3. 식혜
<!DOCTYPE html>

<body>
   <ul>
	 <li>
    		<b>따뜻한 음료</b>
    		<ol>
      		  	<li>커피</li>
       	        	<li>녹차</li>
 	            	<li>둥글레차</li>
  	    	</ol>
       	 </li>
         <li>
    	  	<b>차가운 음료</b>
           	<ol>
       			<li>커피</li>
         		<li>스무디</li>
                	<li>식혜</li>
            	</ol>
          </li>
     </ul>
  </body>

12 다음 표를 생성하시오.

<!DOCTYPE html>
<html>
<body>
	<table border="1">
    	<tr>
        	<th colspan="6">지역별 홍차</th>
        </tr>
        <tr>
            <th rowspan="6">뿌리차</th>
            <td>인삼차</td>
            <th rowspan="9">과일차</th>
            <td>수정과</td>
            <th rowspan="5">잎차</th>
            <td>뽕잎차</td>
        </tr>
        <tr>
            <td>당귀차</td>
            <td>유자차</td>
            <td>감잎차</td>
        </tr>
         <tr>
            <td>생강차</td>
            <td>구기자차</td>
            <td>솔잎차</td>
        </tr>
         <tr>
            <td>칡차</td>
            <td>대추차</td>
            <td>국화차</td>
        </tr>
         <tr>
            <td>둥글레차</td>
            <td>오미자차</td>
            <td>이슬차</td>
        </tr>   
         <tr>
            <td>마차</td>
            <td>매실차</td>
            <th rowspan="4">기타</th>
            <td>두충차</td>
         </tr>
          <tr>
            <th rowspan="3">곡물차</th>
            <td>보리차</td>
            <td>모과차</td>
            <td>영지버섯차</td>
        </tr>
         <tr>
            <td>옥수수차</td>
            <td>산수유차</td>
            <td>귤강차</td>
        </tr>
         <tr>
            <td>현미차</td>
            <td>탱자차</td>
            <td>쌍화차</td>
        </tr>
  </body>
  </html>
반응형

관련글 더보기

댓글 영역