HTML 반응형 웹 & 코드

### html 반응형 웹

  : 모든 장치에서 잘 보이는 웹 페이지를 만드는 것이다.(화면 크기와 뷰포트에 따라 자동으로 조정)
  
    부트스트랩
    
    frame work
    
    Media Queries
    
    full Example
    
  뷰포트 설정 : 헤드-<meta> 참조
  	-> (https://velog.io/@yedindin/HTML-%ED%97%A4%EB%93%9C)
  
  반응형 이미지
  
    너비 속성 사용 : style="width: 100%;" 
    
    최대 너비 속성 사용: style="max-width: 100%;"
    
  		필요에 따라 축소는 되지만 더이상 확대되지 않는다. 
        
  	<picture> 사용 : 이미지-<picture> 참조
    	-> (https://velog.io/@yedindin/HTML-%EC%9D%B4%EB%AF%B8%EC%A7%80)
    
  반응형 텍스트 
  
    vw 단위로 설정 (1vw: 뷰포트 너비의 1%)
    	ex) <h1 style="font-size:10vw">Hello World</h1>

### html 컴퓨터 코드

  <kbd> : 키보드 입력을 정의하는 데 사용한다.
  	ex) <p>Save the document by pressing <kbd>Ctrl + S</kbd></p>
    
  <samp> :프로그램의 샘플 출력을 정의하는 데 사용한다. 
  	ex) <p><samp>File not found.<br>Press F1 to continue</samp></p>
    
  <code> : 컴퓨터 코드를 정의하는 데 사용한다.(줄바꿈 적용 안됨)
    ex)
    <code>
    x = 5;
    y = 6;
    z = x + y;
    </code>
    
    줄 바꾸기 사용 위해서 <pre> 사용 가능
    ex)
    <pre>
    <code>
    x = 5;
    y = 6;
    z = x + y;
    </code>
    </pre>
    
  <var> : 프로그래밍 또는 수식에서 변수를 정의하는 데 사용한다. (이탤릭체로 표시)
    ex) <p>The area of a triangle is: 1/2 x <var>b</var> x <var>h</var>, where <var>b</var> is the base, and <var>h</var> is the vertical height.</p>