본문 바로가기

공부/HTML3

HTML #2 Tag 파란색은 Box 사용자에게 보여지지 않는 태그 빨간색은 Item 사용자에게 보여지는 태그 자동 랜더링 Item tag : href 링크 걸 사이트 주소 입력 target 어떻게 창을 열것인지 정의 위에는 _blank 로 새로운 창으로 사이트 연다고 한 것 그래서 옆에 보면 Click 떠있는거 보임 누르면 새로운 구글 창이 나옴 자세한 설명은 하단 docs 링크 참고 developer.mozilla.org/en-US/docs/Web/HTML/Element/a Text Tag : Block, Inline Inline 옆공간에 있음 Inline 옆공간에 있음 (CSS로 꾸미기 가능) Block 옆에 공간이 있음에도 밑에 줄로 내려와있음 List (ol vs ul) tag 쓸때 ol>li*3 이렇게 즉 orde.. 2020. 9. 28.
HTML #1 기본개념 위 파란색 박스 main에는 이렇게 section으로 나뉘어져 한 section 안에 article로 구분되어 질수있다 옆에 이미지 article 안에는 텍스트 본문과 아이콘이 있다 이렇게 반복되고 재사용이 가능한 걸 묶어둔 것이 article이다. box 안에 들어있는 것들이 섹션 나뉘어지는 태그이다 특히 section 안에서 article이 여러개 들어갈수있고 div 는 스타일링이 필요할때 컬러를 넣거나 묶어야할때 사용된다 굉장히 많이 쓰는 태그 어디서나 사용가능 item은 사용자들에게 보여지는 태그 모음 a 는 링크 걸 수 있는 태그이다 item 태그들을 크게 2가지로 나누어서 생각해보면 좋다 밑에 두가지가 배치되는 구조가 조금 다르다 ↓ 위와 같이 노란색 박스를 핑크색 옆에 배치하려고 해보자 Bl.. 2020. 9. 25.
HTML 공부 jsbin.com/sozeyuyoto/edit?html,output JS Bin Sample of the bin: jsbin.com 위 링크 들어가면 따로 프로그램 설치 없이 html을 바로바로 확인 가능한 페이지 html은 크게 2개로 분류됨 head - 빨간박스 UI 요소는 없음 인터넷에 검색할때 사용되는 title 이나 부가설명 그리고 북마크 추가할때 나오는 제목이나 아이콘 등을 정의함 즉 사용자에게 보여지는 것은 없고 상세설명으로 meta data 만 가지고 있다 body - 파란박스 사용자에게 보여지는 UI 적인 부분 아주 중요 위 이미지 보는 것과 같이 파란 박스 부분은 오른쪽 부분과 같이 바로 눈에 보여지게 됨 사용한 태그 설명은 하단과 같다 h1 => heading 큰글씨 h2 => hea.. 2020. 9. 22.