2020/06 15

메타데이터 - Tag, Link, Style, MIME Type, Base

1. Tag, Link header = 헤더 - 로고, 메뉴 //영역을 사용하기 때문에 블럭요소이다 footer = 푸터 - 주소, 사업자... //영역을 사용하기 때문에 블럭요소이다 main = 메인 - 핵심 //영역을 사용하기 때문에 블럭요소이다 article = 아티클 - 독립, 재사용 //영역을 사용하기 때문에 블럭요소이다 seciton = 영역 설정 - 영역, 제목(h1~h6) vs div = 영역설정 - 아무의미 없음 //영역을 사용하기 때문에 블럭요소이다 aside = 옆부분 - 광고 //영역을 사용하기 때문에 블럭요소이다 nav = 다른페이지 링크 제공 - Home, About, Contact (목차, 색인 등을 설정) //영역을 사용하기 때문에 블럭요소이다 address = 연락처 정보 ..

메타데이터 - 속성

1. charset EUC-KR UTF-8 완성형 조합형 홍 길 동 각각 글자를 찾아서 출력하기 때문에 만약 존재하지 않는 한글이 있다면 깨져서 출력된다. ㅎ ㅗ ㅇ ㄱ ㅣ ㄹ... 등등 이런식으로 단어를 찾고 조합해서 출력하기 때문에 조합할수있는 경우의 수만 존재한다면 거의 대부분의 문장을 만들 수 있다. 오래된 사이트에서 볼 수 있는 인코딩 방식 요즘 많이 사용하는 인코딩 방식 2. content 이 속성은 name 속성 중 어떤 것이 사용되느냐에 따라 해당 속성의 값을 갖는다. author 문서의 작성자를 정의한다. description 페이지의 내용에 대한 짧고 정확한 요약을 담고 있다. Firefoxs나 오페라와 같은 여러 브라우저에서는 이를 즐겨 찾기 페이지의 기본 설명으로 사용한다. gene..

블록레벨(Block level) 요소와 인라인(Inline) 요소

1. 블록 요소 1. DIV, H1, P 2. 사용 가능한 최대 가로 너비를 사용한다. -->다음과 같이 가로 너비를 설정하지 않아도 왼쪽부터 오른쪽 끝까지 빨간색으로 채워진걸 볼 수 있다. body{ margin : 0; padding : 0; } div{ background : red; height : 20px; } 3. 크기를 지정할 수 있다. -->크기가 지정해준만큼 커진다. body{ margin : 0; padding : 0; } div{ background : red; width : 200px; height : 150px; } 4. (width : 100%; height : 0; 으로 시작) 5.수직으로 쌓임 6.margin, padding 위,아래, 좌, 우 사용 가능하다. 7.레이아웃 c..

HTML/요소 2020.06.05

간단한 UI 만들기

HTML 코드 Personal Open Source Business Explore CSS코드 body{ margin : 0; padding : 0; } .header{ background: white; border-bottom: 1px solid lightgray; /*1픽셀 두깨의 가늘한 실선을 밝은회색으로 하겠다*/ } .container{ width : 980px; margin : auto; } .container-left{ /*위아래는 20 좌우는0으로 정한다. 최상위 버전에서보다 하위버전에서 조절하는것이 좋다*/ padding-top : 20px; padding-bottom : 20px; } .logo{ float : left; margin-right: 10px; } .logo img { dis..

HTML & CSS/기초 2020.06.05

속성 - 크기, 여백, 색상

1. width(가로너비) 요소의 가로 너비를 지정한다. 단위는 px을 사용한다. 2. height(세로너비) 요소의 세로 너비를 지정한다. 단위는 px을 사용한다. 3. font-size(글자크기) 요소 내용(Text)의 글자 크기를 지정한다. 만약에 글자 크기를 지정하지 않았다면, 대부분 기본값이 16px로 되어있다. .box{ width : 300px; height : 200px; background : red; font-size : 30px; } 1. margin(요소의 바깥 여백) 요소의 바깐 여백을 지정한다. 바깥 여백은 요소와 요소 사이의 여백(거리, 공간)을 생성할 때 사용한다. div{ margin : 10px; } 위 코드는 margin은 요소의 위, 아래, 좌, 우 모두 10px의 여..

CSS/기초 2020.06.04