본문 바로가기

프로그래밍 놀이터/Web175

[기초강좌] HTML Forms and Input - w3schools 번역 [기초강좌] HTML Forms and Input - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_forms.asp HTML Form 은 여러 종류의 input 을 받기 위해서 사용된다. HTML Forms HTML Form 은 서버에 데이터를 전송하기 위해서 사용된다. HTML form 은 text field, checkbox, radio-button, submit button 등의 입력을 받는 element 들을 가지고 있다. form 은 select list, textarea, fieldset, legend, label 과 같은 element 들도 가지고 있다. tag 는 HTML form 을 생성하.. 2014. 3. 21.
[기초강좌] 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.
Bootstrap All Functions #2 Bootstrap All Functions #2 HTML 5 Doctype .. Mobile First BootStrap 3 부터는 기본적으로 responsive web page 이다. Bootstrap 3 부터는 모바일 단말들이 먼저이고, 데스크탑을 다음 순위로 지원한다. 추가적으로 user-scalable=no 를 넣을수도 있다. 이 녀석은 모바일 단말에서 zoom 을 막는 효과가 있다.maximum-scale=1.0 은 user-scable=no 와 함께 쓰여서 native app 과 비슷한 효과를 볼 수는 있으나, responsiveness 는 떨어진다고 볼 수 있다. Responsive Images .img-responsive{ display: inline-block; height: auto; .. 2014. 3. 18.
[기초강좌] HTML Lists - w3schools 번역 [기초강좌] HTML Lists - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_lists.asp 가장 흔하게 쓰이는 HTML list 는 정렬된 리스트( 원문 : ordered list ) 와 정렬 안된 리스트 ( 원문 : unordered list ) 이다. HTML Unordered Lists 정렬되지 않은 list 는 tag 로 시작된다. 각 리스트 아이템은 tag 로 정의된다. 리스트 아이템은 작은 동그라미 ( 원문 : bullet ) 로 표시된다. CoffeeMilk CoffeeMilk HTML Ordered Lists 정렬된 리스트는 tag 로 시작된다. 각 리스트 아이템은 tag 로 정의된다.. 2014. 3. 17.
[기초강좌] 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 Images - w3schools 번역 [기초강좌] HTML Images - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_images.asp HTML Images - The Tag and the Src Attribute HTML 에서 이미지들은 tag 를 이용해서 정의된다. tag 는 empty tag 이다. 다시 말해 속성들을 가지고 있고, closing tag 가 없다. 이미지를 표시하기 위해서는 src 속성이 필요하다. src 는 "source" 를 의미한다. src 속성에는 표시하고 싶은 image 의 url 을 명시해 준다. syntax 는 아래와 같다. URL 은 이미지가 저장된 장소를 의미한다. 이름이 "boat.gif" 이면서 ".. 2014. 3. 12.
[기초강좌] 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.