제주코딩베이스캠프 후기1: 캠프소개 + HTML

드디어 첫 교육! 얼마나 기다려왔던가!
여러 직업들에 대해서 들었는데 나는 front-end나 정보보완쪽으로 가고싶다.
내가 생할코딩을 들었더니 다행히 html과 css는 따라잡을 수 있었다.

오전 강의 정리 : 개요설명

하는 일	우선순위 언어,해야할 것들, 할 수 있는 직업
Front-end	HTML, CSS, JS
back-end	Linux, JS, Jaca, Python
네트워크관리사	네트워크관리사 2급, CCN
정보보안	통합보안관제실, 정보보안 R&D, 보안 운영, 정보보안기사(자격증취득시 바로 취업가능)

정보보안은 깊게 이해하고 있어야한다. 항상 인력이 부족한 영역.

오전 강의 정리 : HTML 꿀팁

atom에서 느낌표와 탭을 누르면 html자동으로 적힌다

글자크기확대는 컨트롤과 마우스의 힐로 조정.

쉬프트 누르고 행을 클릭하면 해당 행 삭제됨.

div는 디비전으로 특정 영역을 나눠 주는 것. 그 특정 영역만 css다르게 적용할 때 주로 사용(ex)특정부분 색깔 변경 등등

web brower란 서버에서 가져온 태크(내가 쓴 태크)를 해석해주는 것.

웹브라우저(크롬,익스플로어등등)마다 지원해주는 태크가 다르다.

h1누르고 tab을 클릭하면 자동으로 h1 /h1 꺽쇠세트가 자동완성됨.
<h1></h1>


h1{hello world}*n 누르고 tab 치면 n번 적힘 
예를들어 h1{hello world}*5 누르고 tab을 누르면 5번 적힌다 
 <h1>hello world</h1>
 <h1>hello world</h1>
 <h1>hello world</h1>
 <h1>hello world</h1>
 <h1>hello world</h1>


h$*6 누르고 tab을 치면 h1부터 h6까지 꺽쇠포함해서 작성됨 개이득.
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>


.one하고 tab치면 div class="one" /div 이렇게 클래스가 됨
<div class="one"> </div> 


.one#two하고 tab치면 div class="one" id="two"/div 이렇게 클래스는 원이고 아이디는 투가 됨
<div class="one" id="two"> </div> 


.one two three#four하고 tab치면 div class="one two three" id="four" /div 이렇게 클래스는 원투쓰리고 아이디는 포가 됨.
<div class="one two three" id="four"> </div>


table>(tr>td*4)*5하고 tab치면 테이블이 완성 되며,
tr이 행(5개)이고 td가 열(4개)임.
        <table>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </table>


.one_$*5하고 tab하면 클래스 1부터 5까지 만드는 거임
<div class="one1"></div>
<div class="one2"></div>
<div class="one3"></div>
<div class="one4"></div>
<div class="one5"></div> 


h1+h2 하고 tab치면 h1꺽쇠세트와 h2꺽쇠세트가 자동완성됨.
<h1></h1>
<h2></h2>


의미없는 문자열 만드는 것은 lorem하고 tab치면 됨. 홈페이지만들때 글자골격을 위해 자주 사용함.
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Culpa perferendis libero nemo inventore enim aspernatur asperiores consectetur voluptatibus quasi accusamus quas nobis earum, animi, ab, itaque sequi ipsa voluptas cumque?


b태크와 strong태크는 HTML5에서 같이 굵게를 만들어주지만 차이점이 있다면, 
시각장애인을 위해 음성을 읽을때 b태그는 음성강조가 안되지만 strong태크는 음성강조가 됨 => strong 태크를 쓸 것!
<strong>야망</strong>


i태크와 em태크도 기울게로 동일하지만 음성인식에 있어 em태그가 음성강조가 들어감.=> em태크 쓸 것!
<em>야망</em>


mark태크는 노란색으로 셀색칠해줌
<mark>야망</mark>

ol과 ul차이점은 ol은 순서가 있는 리스트 만들어주고 ul은 순서가 없는 리스트임. 

활용팁 : ul태크는 앞의 점을 없애고 가로로 나열되는 걸 세로로 나열해서 홈페이지의 메뉴로 많이 사용함
<ol></ol>
<ul></ul>

오후 강의 정리 : HTML

HTML 주석달기 : 컨트롤 + / 
=> 주석처리모양 <!-- -->


CSS 주석달기 : 컨트롤 + / 
=> 주석처리모양 /* */