Javascript-full-stack 28

멀티미디어 관련 태그

텍스트뿐만 아니라 이미지, 음악, 영상 등 다양한 멀티미디어 웹 컨텐츠로 사용할 수 있다. *이미지 태그 사용법과 속성 태그는 빈 요소 이기 때문에 종료 태그로 작성하지 않는다. alt 속성은 src 속성이 빈 값 일 때(이미지가 정상 출력되지 않을 때, 이미지 파일이 없을 때) 이미지 대신 표시할 문구를 출력한다. 이미지 크기 조정 태그에서 이미지의 높이나 너비를 지정하는 속성 또한 추가할 수 있다. 이 사용법은 권장하지 않는다. HTML은 웹 페이지의 구조를 정의할 때, CSS는 웹 페이지와 관련된 모든 스타일을 정의할 때 사용하다. 크기 조정은 CSS에 해당하기 때문에 특별한 경우가 아니면 사용하지 않도록 하자. *오디오와 비디오 태그 오디오 태그 type 속성은 확장자의 음원 형식을 뜻하는데 생략..

링크 태그_웹사이트의 경로와 주소

하이퍼 링크(Hyperlink)는 하이퍼 텍스트를 가능하게 만든 핵심 도구이다. 즉 주소링크를 말한다. 링크 태그 하이퍼 링크의 역활을 수행한다. 태그는 태그와 컨텐츠, 속성으로 구성되어 있다. ex) 컨텐츠 속성(attributes)은 태그의 특징, 즉 태그에 대한 추가 정보의 모음이다. 모든 태그에 속성을 입력할 수 있지만 항상 필히는 아니다. 하지만 태그는 필수이다. 의 속성, href : href는 Hypertext Reference의 약자로, 가 참조하는 웹사이트 주소(경로)를 값으로 가진다. 의 속성, target : target 속성은 링크를 클릭했을 때 해당 페이지를 어디에서 열지 정하는 속성이다. -target의 대표적인 값은 _self 와 _blank가 있다. _self는 현재 탭에서 ..

제목과 본문 태그

제목 태그는 제목을 나타내고 싶을 때 사용한다. 중요도에 따라 부터 까지 사용할 수 있다. h1 제목입니다. h2 제목입니다. h3 제목입니다. h4 제목입니다. h5 제목입니다. h6 제목입니다. 본문 태그 - paragraphs의 약자로, 단락 혹은 문단이라는 뜻. 내용 형식으로 사용하면된다. - division의 약자로 분할의 뜻을 가진다. - 아무 것도 나타내지 않고 그저 각각의 태그를 구분 짖기 위해 사용하는 태그이다. - 보통 css를 이용하여 레이아웃를 배치할 때 css를 효과적으로 적용하기 위해, 또는 묶어서 사용하기 위해 사용한다. 1번 문장입니다. 2번 문장입니다. 3번 문장입니다. - preformatted의 약자로, 형식화된 텍스트를 즉, 적은 내용 그대로를 브라우저에 표시하는 태그..

vs code으로 html 기본구조 자동완성하기

html 기본구조를 매번 프로그래밍 할 때 마다 코드를 작성하는 것은 비효율적이라는 생각이 많이 들었다. 그래서 기본구조를 자동적으로 완성할 수 있는 방법이 없을까 찾아보았다. 방법은 생각이상으로 간단하다. 1. 빈 html 파일을 만든다. 2. 화면과 같이 !를 입력하면 도움도구가 생성되는데 바로 Tab을 누른다. 3. 그러면 다음과 같이 html기본구조가 자동적으로 생성된다. lang="en" 부분을 lang="ko"로 변경해준다. (자주 쓰는 언어에 관련된거라 보통 한국어로 적을 것이기 때문에 언어를 바꿔주는 과정이다.)

시맨틱 태그(Semantic tag)

Semantic은 '의미론적'이라는 뜻을 가진 단어이다. 의미를 가지는 태그로, 나눠진 구획의 기능을 태그 이름만으로도 이해할 수 있다. Semantic의 장점 1. SEO 최적화에 유리. (SEO: Search Engine Optimization) 검색 엔진이 태그의 목적에 부합하게 설계되어있는 구조의 사이트에서 더욱 빨리 효율적으로 정보를 파악할 수 있어 검색 결과의 노출에 유리할 수 있게 해준다. 2. 웹 접근성에 효율적 일반적인 브라우저에서는 차이가 없지만 스크린리더(시각장애인을 위한 웹 서핑 프로그램)과 같은 환경에서는 웹 접근성과 사용성을 향상시켜준다. 3. 유지보수의 용이성 많은 div사용으로 관리가 어려워지는 문제점에서 벗어나 태그의 이름만 보고도 어떤 영역인지 바로 확인이 가능하며 해당 ..

Head 와 Body

태그 안에는 크게 바로 실행해보면서 배우는 HTML/CSS HTML과 CSS에 대해서 배워봅시다! 태그 - HTML문서에 대한 정보를 담고 있다. - 일반 사용자는 웹 사이트에서 태그에 속한 정보를 볼 수 없다. - 이 태그는 단 하나만 존재할 수 있다. - 태그 바로 아래 위치한다. 태그 - 문서와 관련된 정보를 담는 태그이다. 태그 - 윕 페이지의 제목을 담는 태그. - 브라우저에서 탭의 제목이나 즐겨찾기 했을 때 이름으로 볼 수 있다. 태그 - HTML 문서에서 실제 보여지는 부분 - 단 하나만 존재 태그 - 제목을 표시하는 태그 태그 - 단락을 표시하는 태그, 컨텐츠 중 글, 본문에 해당하는 내용을 포함

HTML의 기본 구성

국비지원으로 구름(goorm)에서 바로 써먹는 풀스택 기초[자바스크립트]를 배우고 있다. 공부하는 내용을 이렇게 블로그로 포스팅하려고 한다.(나중에 다시 공부하고 싶을 때 볼 수 있도록) HTML(Hypertext Markup Language)은 컨텐츠의 구조를 정의하는 마크업언어이다. 컨텐츠(내용)에 태그(마크)를 씌워 구조를 구분하여 정의한다. 태그+컨텐츠+태그 형식을 요소(Element)라 한다. 바로 실행해보면서 배우는 HTML5/CSS3 제목, 부제목, 내용은 각각 , , 태그를 사용한다. (태그는 대문자로 작성할 수는 있지만, 주로 소문자로 작성하길 권장한다고 한다.) HTML의 요소(Element)가 하나 둘 쌓여 HTML 문서를 이룬다. 하지만 요소만으로는 문서를 완성할 수 없다. 다음 태..

728x90