[HTML] HTML 기본 정리

1. HTML5 기본 템플릿 코드 DOCTYPE 해당 HTML 파일이 어떤 버전으로 만들어 졌는지 나타내며, 브라우저가 다르게 렌더링 하지 않도록 하기 위해 HTML문서임을 알려준다. HTML HTML문서라는것을 나타내며 모든 코드를 감싼다. lang은 웹페이지 언어를 설정하는 속성(ko, en등) HEAD HTML 태그 안에는 페이지의 제목 설명, 외부에서 불러오는 파일링크등 페이지 정보를 적는다. META 문서 전반에 정보를 표시하기 위한 설정 charset : 문자 인코딩 설정 (utf-8, euc-kr등) name : 메타 정보의 이름 author : 저자 이름 description : HTML 문서 설명 keywords : 검색엔진을 위한 키워드 호환성 관련 태그 인터넷 익스플로러(IE)에서 최..

• format_list_bulleted Web
• · 2022. 12. 9.
• textsms

[CSS] Box Model과 Box Sizing

위에 보이는 CSS 프로퍼티들을 많이 보셨겠지만, 위 프로퍼티들이 어떤 요소에 영향을 주는지 또 사용하면서 원하던 크기대로 잡히지 않는 경우가 발생하기도 하는데 왜 그런지 살펴보도록 하겠습니다. 이 부분을 이해하기 위해선 먼저 박스 모델(box model)이라는 개념을 알아야 합니다. 박스 모델(Box Model)이란? HTML의 모든 요소들은 BOX 모양으로 구성되어 있는데, 이것을 박스 모델(box model)이라고 부릅니다. 박스 모델은 안쪽부터 content, padding, border, margin으로 구분합니다. content 텍스트, 이미지, Input, div 요소 등 모든 콘텐츠 가로는 width, 세로는 height로 표현 padding - content를 둘러싼 공간(border와 ..

• format_list_bulleted Web
• · 2022. 10. 17.
• textsms