HTML 기본 구조 : HTML5를 사용하고 있음을 명시. 문서의 첫 번째 줄에 위치 : 모든 HTML요소를 감싸는 최상위 요소. lang속성으로 문서의 언어를 설정할 수 있음 : 메타데이터를 포함하며, 웹 페이지의 제목, 문자 인코딩, 외부 스타일 시트 등 설정 : 문서의 문자 인코딩 방식을 설정 : 뷰포트를 설정하여 모바일 기기에서도 적절히 표시되도록 함 : 웹 페이지의 제목 설정. 브라우저의 제목 표시줄이나 탭에 표시됨 : 외부 스타일 시트 연결. href속성으로 스타일 시트 파일의 경로 지정 : 내부 스타일 시트를 정의. CSS 코드를 직접 포함할 수 있음 텍스트 관련 요소제목 요소~ : 제목을 표시하는 데 사용. 은 가장 중요한 제목, 은 가장 덜 중요한 제목을 나타냄. ID와 클래스 속성을 통..

시맨틱 마크업 (Semantic Markup)시맨틱은 '의미론적인'이라는 의미 시맨틱 태그는 개발자와 브라우저에게 의미를 제공콘텐츠 태그명은 '이 요소가 가진 목적이나 역할은 무엇인가'를 나타냄  -> 검색 엔진에 좋은 단서 시맨틱 장점대부분의 시맨틱 태그는 컨테이너 태그(div, span)와 같이 특별한 스타일을 제공하지 않음그러나 장점이 있다!!!검색 엔진은 시맨틱 태그를 중요한 단서로 봄시각 장애가 있는 사용자가 화면 판독기로 페이지 탐색할 때 참조가 됨코드의 가독성이 좋아짐컨테이너의 남용을 방지할 수 있어 코드 쓰기가 편함 대표적인 시맨틱 태그태그명의미태그명의미독립적인 콘텐츠머릿말별도의 콘텐츠주된 콘텐츠추가적인 상세한 정보네비게이션 링크figure의 자막콘텐츠의 한 섹션 (절)설명 붙는 독립 컨텐..

수업 내용 정리  Tag(Element)의 기본 요소엘리먼트 : 우리가 태그라고 부르는 것의 정식명칭은 엘리먼트로 한국말로 요소라고 함태그 : 엘리먼트의 종류를 기술할 때 안에 적는 것을 의미함, 즉 엘리먼트의 이름컨텐츠 : 내용으로 여는 태그와 닫는 태그 사이에 기술 됨, 안에 다른 엘리먼트가 들어갈 수도 있는데 이 경우 해당 엘리먼트는 children(자식)이 됨속성 : 엘리먼트의 속성(Attribute)을 나타냄, 값이 없을 수도 있고 있을 수도 있는데 있다면 반드시 ="값" 형태로 적어줘야 함 void tag와 self closing tag같은 형태가 아니라 혹은 같이 닫는 태그가 없거나 본체에 포함된 경우가 있음이런 태그의 정식 명칭은 void tag이며 self closing tag라는 명칭과..

HTML에 스타일을 적용하는 세가지 방법1. 인라인 스타일 (Inline CSS)HTML 요소에 직접 스타일을 지정하는 방법, 각 요소의 style속성에 CSS 코드 작성장점 : 특정 요소에 빠르게 스타일을 적용할 수 있음단점 : 코드가 복잡해지고, 유지보수가 어려움안녕하세요 권여진입니다 2. 내부 스타일 시트 (Internal CSS)HTML 문서의 안녕하세요 권여진입니다 3. 외부 스타일 시트 (External CSS)CSS 파일을 별도로 작성한 후 HTML 문서에서 링크로 불러오는 방법, 웹사이트의 여러 페이지에서 같은 스타일을 적용할 수 있어 유지보수 용이장점 : 여러 페이지에 동일한 스타일을 쉽게 적용할 수 있고, 코드가 깔끔해짐단점 : 파일을 별도로 로드하므로 페이지 로딩 속도에 영향을 미..