본문 바로가기

HTML, CSS, ECMA6

(11)
[부트스트랩(Bootstrap)] 부트스트랩 나아가기 부트스트랩 나아가기 glyphicons 으로 부트스트랩에서 제공하는 아이콘 사용하기 glyphicon glyphicon-adjust glyphicon glyphicon-align-center 아이콘 관련한 자세한 사항은 다음의 링크를 참조 부트스트랩 컴포넌트 Font Awesome 드롭다운 메뉴 기본적인 드롭다운 여기를 클릭하세요. 메뉴 1 메뉴 2 메뉴 3 분리된 메뉴 드롭다운에 별도의 헤더 추가 가능 / class="disabled" 포함 헤더 메뉴 1 메뉴 2 메뉴 2 메뉴 3 다른 헤더 분리된 메뉴 버튼 그룹화 버튼그룹 일반적인 버튼 버튼 1 버튼 2 버튼 3 버튼 4 버튼 그룹으로 묶은 후 모습 버튼 1 버튼 2 버튼 3 버튼 4 버튼 그룹을 이용해서 버튼 크기 일괄 조절 버튼 1 버튼 2 버튼..
[CSS] 선택자 알아보기 HTML CSS - 선택자 태그 선택자 : 선택자 { 속성: 속성값; } Class 선택자 : .CLASSNAME { 속성이름: 속성값; } ID 선택자 : #ID { 속성이름: 속성값; } 종속 선택자 : h1#head { … } | .headline.selected { … } | input#user-id.focused { …} | p.title { … } 하위 선택자 : body h1, body h2, body p { … } | p .txt1 { … } .headline span 그룹 선택자 : body h1, body h2, body p { … } | .right_box, .left_box { … } 수도 선택자(Psuedo Selector) : :hover -> 마우스의 커서가 올라가 있는 상태 ..
[부트스트랩(BootStrap)] 기본 구조 파악하기 레이아웃 그리드 시스템 : 총 12*4으로 이루어져 있음 구조는 container -> row -> col 순서로 진행 ... 폰트 만일 폰트가 없으면 구글 서버에서 불러오거나 운영 서버에 fonts를 다운받아서 사용한다. @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); @font-face{ font-family:'NanumGothic'; src:url("../fonts/NanumGothic.eot"); src:local(""), url("../fonts/NanumGothic.woff") format("woff"); } @font-face{ font-family:'NanumBarunGothic'; s..