본문 바로가기
[기초강좌] HTML Layouts - w3schools 번역 [기초강좌] HTML Layouts - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_layout.asp 웹 페이지 레이아웃은 웹 사이트를 나이스 하게 보이도록 하는 데 매우 중요한 요소이다. 당신의 웹 페이지를 신중하게 디자인하라. Website Layouts 대부분의 웹사이트는 내용을 여러개의 컬럼을 이용하여 표시한다. ( 잡지나 신문처럼 ) 여러개의 컬럼은 나 element 를 사용하여 만들 수 있다. CSS 는 element 들의 위치를 지정하거나, 배경 지정, 그리고 컬러풀한 외관을 위해 사용된다. Tip : HTML table 을 이용해서도 좋은 레이아웃팅을 할 수는 있지만, table tag 는.. 2014. 3. 19.
[기초강좌] HTML Blocks - w3schools 번역 [기초강좌] HTML Blocks - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_blocks.asp HTML element 는 와 으로 그룹화 될 수 있다. HTML Block Elements. 대부분의 HTML element 는 Block level 또는 inline level 로 정의된다. Block level element 는 보통 줄바꿈 후 시작하고, 끝나면 줄바꿈을 추가하여 브라우저에 표시된다. Block level tag 의 예는 , , , HTML Inline Elements Inline Elements 는 보통 줄바꿈 없이 표시된다. Inline level tag 의 예는 , , , The.. 2014. 3. 18.
[기초강좌] HTML Tables - w3schools 번역 [기초강좌] HTML Tables - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_tables.asp HTML Tables 테이블은 tag 로 정의된다. 테이블의 행( 원문 : row ) 은 tag 로 정의된다. ( tr 은 table row 의 약자 ) 행의 셀( 혹은 열 ) 은 tag 로 정의된다. ( td 는 table data 의 약자 ) 행은 heading 으로 구분될 수도 있는데 이는 tag 를 사용한다. ( th 는 table heading 의 약자 ) elements 는 테이블의 데이터를 표시하는 곳이다. element 는 텍스트, 이미지, 리스트, 다른 테이블 등을 담을 수 있다. 테이블의.. 2014. 3. 13.
Bootstrap All Functions #1 Bootstrap All Functions #1 Container, Row, SpanX Responsive Web Typography -기본 tag 들에 대해서도 style 이 적용되어 있다. - blockquote 의 경우 위와 같이 두드러지게 바뀐다. -기본 tag 의 style 을 제거하려면 class="unstyled" 를 적용한다. -dl 의 경우 class="dl-horizontal" 로 수평 definition list 를 사용할 수 있다. Glyphicon User -Glyphicon customize pagehttp://www.w3resource.com/twitter-bootstrap/3/glyph-customization.html Table Forms Search -bootstrap 의.. 2014. 3. 13.
[기초강좌] HTML Styles - CSS - w3schools 번역 [기초강좌] HTML Styles - CSS - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_css.asp CSS ( Cascading Style Sheets ) 는 HTML element 들을 스타일링 하는 데 사용된다. Styling HTML with CSS CSS 는 HTML 4 와 함께 소개된 것으로, HTML element 들을 더 나은 방법으로 스타일링 하는 데 사용된다. CSS 는 다음과 같은 방법으로 HTML 에 추가될 수 있다.* Inline - style 속성을 이용하여 HTML element 에 표기된다.* Internal - External Style Sheet External Sty.. 2014. 3. 11.
[기초강좌] HTML Head - w3schools 번역 [기초강좌] HTML Head - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_head.asp The HTML The content of the document...... The HTML Element tag 는 페이지 안에 있는 모든 상대경로 URL 의 기본 URL 그리고 기본 target 을 정의한다. The HTML Element tag 는 문서와 외부 리소스와의 관계를 정의한다. tag 는 대부분 style sheet 을 연결할 때 사용된다. The HTML Element tag 는 HTML 문서의 style 정보를 정의하는 데 사용된다. element 안에는 HTML element 들이 어떻게 그.. 2014. 3. 10.
[CSS] Bower 가 무엇인가? [CSS] Bower 가 무엇인가? Bower 란? Twitter 에서 만든 web 을 위한 package manager. Bower 설치하기 $ npm install -g bower // bower.json 에 명시된 dependency list 를 바탕으로 install 을 한다.$ bower install $ bower install $ bower install # 패키지 찾기 $ bower search [] 패키지 제거하기 $ bower uninstall bower, bower 설치, bower.json, bower란, css, NPM, npm install, package manager, search, twitter, Uninstall, WEB, [CSS] Bower 가 무엇인가?, 사용하기, .. 2014. 2. 14.
[CSS] Less 란 무엇인가? [CSS] Less 란 무엇인가? Less 란 무엇인가? Less 는 CSS pre-processor 이다.CSS language 의 확장판으로, variable, mixin, function 등의 추가적인 기능을 제공하는 언어이다.유지보수가 더 좋고, theme 을 지정할 수 있고, 확장성도 좋다. ex) @base : #f938ab; .box-shadow(@style, @c) when (iscolor(@c)){-webkit-box-shadow:@style @c;-moz-box-shadow: @style @c;-box-shadow: @style @c;} .box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)){.box-shadow(@style, rgba(0,.. 2014. 2. 10.
[CSS] Bootstrap Tutorial #1 - download & setup CSS, Bootstrap Tutorial #1 - download & setup Download and understand file structures 다운로드 https://github.com/twbs/bootstrap/archive/v3.0.0.zip 메인 css 파일인 bootstrap.css 와 bootstrap-min.css 은 dist/css 에 들어있다. 메인 js 파일인 bootstrap.js 와 bootstrap-min.js 는 dist/js 에 들어이다. root 에 있는 js 폴더는 다른 js plug-in 들이다.asset/js 폴더에는 html5shiv.js 와 respond.min.js 가 들어있다.이것들은 IE8 을 support 하는 녀석들이다. asset/js 에는 jqu.. 2014. 2. 8.
반응형