[DAY - 1] h, p, br, ul, ol, dl, div, strong, em, a

• h
• p
• br
• ul
• ol
• dl
• div
• strong
• em
• a

• alt+z
• alt+shift+ ↓

 

1) h

h-제목을 입력할때, h1~h6 숫자가 커질수록 폰트는 작아진다.

    <h1>비코딩</h1>
    <h2>비코딩</h2>

h1, h2

2) p, br

p-하나의 문단을 만들떄

br-줄바꿈

*br을 남용하는건 좋지 않다고 배웠다.

 

    <h1>비코딩</h1>
    <h2>비코딩</h2>
    <p>비 전공자의 Be develper</p>
    <p>비 전공자의 <br> Be develper</p>

p, br

3) ul, ol

ul-순서가 필요 없는 목록

ol-순서가 필요한 목록

li-목록 내부 항목

*ul안에 ul이 들어갈 수 있다. (ol도 마찬가지)

        <h2>학교</h2>
        <ul>
            <li>초등학교</li>
            <li>중학교</li>
            <li>고등학교</li>
        </ul>
        
        <h2>중학교</h2>
        <ol>
            <li>1학년</li>
            <li>2학년</li>
            <li>3학년</li>
        </ol>

 

ul, ol

4) dl, dt, dd

dl-정의 목록

dt-정의 용어

dd-정의 설명

     <dl>
        <dt>중학교</dt>
        <dd>초등학교 졸업 후 진학하는 중등교육기관</dd>
        <dt>고등학교</dt>
        <dd>중학교 과정 다음의 상위 중등교육기관</dd>
     </dl>

dl, dt, dd

5) div

div-묶을 때 사용

*결과창이 바뀌진 않는다. 코딩시 구별을 편하게 하기위해 쓰는듯 하다.

    <dl>
        <div>
        <dt>중학교</dt>
        <dd>초등학교 졸업 후 진학하는 중등교육기관</dd>
        </div>

        <div>
        <dt>고등학교</dt>
        <dd>중학교 과정 다음의 상위 중등교육기관</dd>
        </div>  
     </dl>

div

6) strong, em, span, b

strong-강강조

em-약강조

span, b-다른 글자와 구분시 사용

    <dl>
        <div>
        <dt><strong>중학교</strong></dt>
        <dd>초등학교 졸업 후 진학하는 중등교육기관</dd>
        </div>

        <div>
        <dt><em>고등학교</em></dt>
        <dd>중학교 과정 다음의 상위 중등교육기관</dd>
        </div>  
     </dl>

strong, em

7) a, href, target, title, alt

a-링크를 걸때 사용

href-링크 주소

target-"_blank" 사용시 새탭

title-툴팁, 마우스 올려놓을때 나오는 메세지

alt-장애인들을 위한 설명 *주로 시각장애인들을 위해 사용하는듯 하다.

    <a href="http://www.naver.com">네이버</a>
    <a href="http://www.naver.com" target="_blank" >네이버</a>
    <a href="http://www.naver.com" target="_blank" title="네이버로 이동합니다.">네이버</a>

a

8) 단축키

alt+z-자동 줄바꿈(Word Wrap) 사용

alt+shift+ ↓-동일한 코드를 반복할때