Web/HTML
-
[HTML] 시멘틱 마크업 - 인라인 텍스트 / 수정 tag / 엔티티Web/HTML 2022. 8. 29. 01:28
#1 인라인 텍스트 - , 문체나 분위기가 다른 문장과 다름 와 는 표현적인 의미를 갖지 X 는 기본적으로 글자가 두껍게 표시된다. (bold) 는 기본적으로 이탤릭체로 표시된다. (italic) 또한, 는 평범한 글자와 구분(아이콘이나 특수기호)하기 위해 사용한다. https://fontawesome.com/ Font Awesome The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More Options. fontawesome.com - 다른 페이지, 같은 페이지 위치(#), 파일, 이메일 주소, 전화번호 등 다른 URL로 연결 할 수 있는 하이퍼링크를 설정 - 약어를 지정 보..
-
[HTML] 시멘틱 마크업 - 블록 요소와 인라인 요소 / 인용, 강조 tagWeb/HTML 2022. 8. 29. 00:11
#1 블록 요소와 인라인 요소 - 블록 요소 , , 등 사용 가능한 최대 가로 너비를 사용한다. 크기를 지정할 수 있다. 수직으로 쌓임 - 인라인 요소 , 등 필요한 만큼의 너비를 사용한다. 크기를 지정할 수 없다. 수평으로 쌓임 * 블록 요소 안에 인라인 요소를 넣을 수 있지만 인라인 요소 안에 블록 요소를 넣을 수 없다. #2 인용 관련 태그 - 짧은 인용문을 설정 - 긴 인용문을 설정 * 와 모두 출처가 필요하다면 cite 속성을 이용하여 출처의 URL을 표기할 수 있다. - 창작물에 대한 참조를 설정 책, 논문, 영화, TV 프로그램, 노래, 게임 등의 제목 Mona Lisa 레오나르도 다 빈치, 1503년 #3 강조 관련 태그 - 의미의 중요성을 나타내기 위해 사용 강한 강조 기본적으로 글자가 ..
-
[HTML] 시멘틱 마크업 - 콘텐츠, 문장, 목록 tagWeb/HTML 2022. 8. 26. 02:40
#1 콘텐츠 구분 태그 - ~ 웹접근성을 좋게 하기 위해 한 페이지에 은 한번만 사용해야한다. ~ 는 중요도, 의미의 구조를 표현하기 때문에 검색엔진이 그 문서의 목차처럼 해석할 수 있다. 제목1 제목2 제목3 제목4 제목5 제목6 웹사이트의 기획 목적과 마케팅 전략에 따라 검색이 잘되어야 하는 제목을 중요도 순으로 작성하는 것이 좋다. 그래야 검색엔진이 웹사이트를 검색 랭킹에 영향을 줄 수 있는 키워드로 간주한다. - 문서의 헤더를 설정 (보통 로고, 제목 등을 포함) - 문서의 푸터를 설정 (보통 저작권, 관련 문서 등을 포함) - 현재 페이지 내 또는 다른 페이지 링크를 제공하는 영역을 설정 (보통 메뉴, 목차 등을 설정) - 문서의 주요 콘텐츠를 설정 한 문서에 하나의 요소만 사용해야 한다. - ..
-
[HTML] 의미있는 문서, HTML 시멘틱 아우트라인Web/HTML 2022. 8. 25. 02:00
#1 HTML과 메모리 Q. HTML 프로그램이 메모리에 어떤 일을 하길래 화면을 그릴 수 있게 되는 걸까? -> html파일로 코드를 작성해보자. -> 개발자 도구에서 작성한 코드를 확인해보자. -> 개발자도구의 콘솔탭에서 'jinHee'를 입력하여 메모리 주소에 대한 정보를 확인해볼 수 있다. 이처럼 이 정보사전을 필요할 때 꺼내쓸 수 있게 된 것이다. -> window : 브라우저의 새탭을 열면 페이지를 구성하기 위해 필요한 메모리 공간이 셋팅된다. 이를 window라고 부른다. 페이지를 만드는데 필요한 도구 프로그램들이 이미 로드되어 있다. -> 우리가 태그를 이용해 생성한 정보뭉치도 이 안에 포함되어 있다. window.document 안에 들어 있다. window로 접근 할 수 있다. - ht..