Kakao Clone04 :: Tag 3day

! nav tag

a href 

<a href ="index.html" class ="tab-bar__tab"></a>

링크를 보내준다. 

tab-bar__tab--selected 

 
.tab-bar .tab-bar__tab--selected{
  color:#523737;
}

selector가 두개이기 때문에 tab-bar 밑에 tab-bar__tab--selected에 color가 적용되는것을 알 수 있다.

! main tag

! placeholder(이미 작성된 내용)

! section tag

! header tag

<span/div... class="적절한 class 이름">Context</...> 

selection > header > h1~h6

! div tag

 

 
<span class="friends__section-tagline">
 Life is short . So live your life.
</span>

div 와 span의 차이

div는 내용뿐만 아니라 width 전체를 포함한다면

span은 내용만을 포함한다.

ex) span.이름 + tab 하면 자동으로 생성된다.

! ul - li 

항상 작업이 끝나면 github에 comment를 달고 push 하는것을 잊지 말자.

div.find__option>i.fa+span.find__option-title + tab 하면 div tag, i tag, span tag가 자동으로 완성된다.

  <i class="fa fa-address-book"></i>
                  

이런식으로 font를 넣을 수 있다.

fa-lg는 이미지를 크게 만들어 준다.

fa-2x, 3x로 하면 2,3배 증가하는것을 알 수 있다.

section tag => 문서에서 뭔가를 설명할때 section으로 구분짓는듯 하다. 

! section 과 div의 차이 (Recommended Friends / You have no recommended friends) 작성해줄때 section과 div로 정의해주던데.

! section밑에 div를 정의 하더라?

div.more__option*4>i.fa+span.more__option-title + tab 하면 만들어진다. 

!큰거는 div로 한줄이나 두줄 이면 span, selection으로 작성하는지 이건 좀더 찾아봐야 겠다.

!Git_desktop