빈코더

1.문구 스타일 문구 스타일에 대해서 알아보도록 하겠습니다. 1. 텍스트 정렬 텍스트 정렬은 왼쪽정렬, 가운데정렬, 오른쪽 정렬이 있습니다. property 이름은 text-align이고 값은 left, center, right입니다. index.css에 특정 클래스이름으로 각각의 정렬 스타일을 작성해두었습니다. .left { text-align: left; } .center { text-align: center; } .right { text-align: right; } 모든 요소의 기본 정렬은 왼쪽 정렬입니다. 2. indent css로 들여쓰기도 할 수 있습니다. .js-description { text-indent: 50px; } html 코드내에서 스페이스와 엔터를 아무리 추가하여도 실제 결과 화..

1. Font Style 이번엔 Font Style를 확인해보도록 합시다. 1. font family #title { font-family: Georgia, "Times New Roman", Times, serif; } 위 코드를 한번 봐볼까요? 앞에서 배웠듯 #은 id의 요소를 바꿀때 사용하였습니다. font-family는 폰트 스타일을 지정하는 속성입니다. 브라우저가 Georgia 라는 폰트를 지원해주면 Georgia 폰트로 적용하겠다는 뜻입니다. 만약 Georgia 폰트가 지원되지 않으면, "Times New Roman"을, 이것도 없으면 Times, 그리고 앞의 세 가지 폰트가 전부 없으면 serif라는 폰트를 사용하겠다는 뜻입니다. "Times New Roman"만 ""(쌍따옴표)로 감싸져 있는..

1. CSS(Cascading Style Sheets) 뜬금 없이 왠 CSS냐고 하실 수 도 있는데 html과 css는 뗄 수 없는 관계기 때문에 한번만 보고 가도록 하겠습니다. CSS란 HTML 요소들에 디자인을 입혀주는 것 입니다. HTML이 헤더, 문단, 테이블 등으로 정보를 조직화하는 구조를 제공한다면, CSS는 HTML이 아름다워 보이도록 스타일을 입히는 것입니다. 2 . CSS 적용 css를 작성 후 HTML에 적용하는 방법은 3가지가 있습니다. 인라인 스타일 style 태그 css 파일에 작성 차례 대로 알아보도록 하겠습니다. 2 - 1. 인라인 스타일 태그 style 속성에 직접 작성하는 방법입니다. FRONTEND 101 h1 tag에 style속성을 주고 color을 red로 지정해주니..

1. HTML Attribute(속성) HTML Attribute에 대해서 다시 한 번 보겠습니다. 네이버로 이동 a는 tag 이름이고 href는 attribute(속성) 이름이며 https://naver.com는 href 속성에 대한 attribute 값이고, "네이버로 이동"은 contant(내용)입니다. 꼭 a tag가 아니더라도 attribute를 사용 할 수 있습니다. 사용 하는 tag에 따라 사용하는 attribute도 달라집니다. 처음에는 tag도 공부해야 하고 attribute도 공부해야 하기 때문에 머리가 좀 아프지만... 공부를 하면서 tag와 attribute는 익혀나가시면 됩니다. 1 - 2. ID id는 각 태그에 이름을 주는 속성입니다. 이름은 이름인데, 주민등록 번호와 같이 한..

여러 tag를 알아보자 1장! 여러가지 tag를 알아보도록 하겠습니다. 1 - 1. h1 ~ h6 tag는 heading 1 의 줄임말입니다. ~ 까지 있습니다. 위 사진을 보면 이 제일 크고 숫자가 커질수록 글씨 크기가 작아지는걸 볼 수 있습니다. 1 - 2. tag는 주로 텍스트를 넣어줍니다. 사용 법은 위와 같고 보다시피 개행이 되지 않고 한줄에 이어 나오는걸 볼 수 있습니다. 이렇게 한줄에 이어 나오는 요소를 inline-element라고 합니다. 1 - 3. tag 또한 텍스트를 주로 넣는 tag입니다. tag는 paragraph의 줄임말로, 주로 문단을 통으로 넣을때 사용합니다. tag는 tag와 달리 개행(줄바꿈)이 되는것을 확인이 가능합니다. 1 - 4. tag는 클릭하면 링크된 곳으로 화..

1. HTML 파일의 구조 HTML 파일의 구조에 항상 아래와 같습니다. 위 코드를 한번 살펴보도록 합시다. 1 - 1. HTML 파일의 제일 첫 째줄에 위치하는 선언문 입니다. 는 HTML 태그는 아닙니다. 해당 html 파일이 어떤 버전의 html을 사용했는지 브라우저에 알려주는 역할을 합니다. 선언을 해주면 html5 버전을 사용한다는 의미입니다. html5는 가장 최신 버전 입니다. 1 - 2. 를 제외한 모든 요소들을 감싸는 tag입니다. 브라우저가 을 만남으로써 html의 시작을 감지하고 요소를 그릴 준비를 합니다. 1 - 3. 위와 같이 문자 셋을 지정해 주거나() 모바일 기기를 고려한 정보를 주기도 합니다() 그리고 웹 페이지의 이름에 대한 정보도 줍니다(repl.it). 1 - 4. ta..

1. HTML(Hypertext Markup Language)의 정의와 기능 안녕하세요!! 오늘은 HTML의 정의와 기능에 대해서 알아보려고 합니다. 한번 확인해봅시다! HTML은 웹 페이지를 만들기 위한 Markup 언어이다. HTML은 구조가 단순하고 다른 프로그래밍 언어에 비해 단순한 구조를 가지고 있어 문법이 쉽다. HTML로 웹페이지의 구조를 잡을 수 있습니다. HTML 파일은 이미지, 텍스트, 비디오, 버튼 등 웹사이트에 보여줄 내용을 구성하고 있습니다. HTML은 위 특징 말고도 다른 많은 특징들이 있습니다. 2. HTML 파일 HTML파일은 끝에 .html 확장자가 붙은 테스트 파일입니다. 파일 이름은 다음과 같이 정할 수 있습니다. index.html main-page.html login..