개념 창고/HTML & CSS

    HTML 상대 경로와 절대 경로

    상대경로 ./ → 주변 경로로 탐색 (./는 생략 가능함) ../ → 상위 폴더로 탐색 절대 경로 http(https) / → //와 같음, 최상위 경로(루트)

    HTML 화면에 이미지 출력하기

    img 태그로 넣으며, src는 경로, alt는 이미지가 어떤 사유로던지 안나올시 텍스트를 띄우는 것을 나타냄.

    HTML 속 head 정보 태그 종류

    1. : HTML 문서의 제목(title)을 정의 웹 브라우저의 탭에 표시 NAVER, Daum 2. : 외부 문서를 가져와 연결할 때 사용(대부분 CSS파일) 필수 속성은 rel(가져올 문서와의 관계), href(가져올 문서의 경로) 3. 4. 4-2. 자바스크립트(JS)를 HTML 문서 안에서 작성하는 경우 5. : HTML문서(웹페이지)의 제작자, 내용, 키워드 같은 여러 정보를 검색엔진이나 브라우저에게 제공 name는 정보의 종류, content는 정보의 값을 나타냄.

    HTML 기본 구조 태그들의 역할

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 cs html - 문서의 전체 범위 HTML 문서의 시작과 끝을 알려주는 역할 head - 문서의 정보를 나타내는 범위 웹 브라우저가 해석할 부분인 웹 페이지의 제목, 설명, 사용할 파일 위치, 스타일(CSS)같은 웹 페이지의 보이지 않는 정보를 작성하는 범위 body - 문서의 구조를 나타내는 범위 사용자의 화면에 보여지는 로고, 헤더, 네비게이션, 메뉴, 버튼, 이미지 등과 같은 웹페이지의 보여지는 구조를 작성하는 범위

    Doctype(DTD) HTML 기본 양식 불러오기(Visual Studio code)

    Visual Studio Code(Vs Code)를 켠 뒤 HTML 파일에서 느낌표를 치게되면 아래와 같이 나온다. 위와 같은 상태에서 Enter 키나 Tab 키를 누르면 아래와 같이 기본 구조가 만들어진다.

    HTML, CSS, JS 개요

    HTML (Hyper Text Markup Language) - 기획자의 영역 페이지의 제목, 문단, 표, 이미지, 동영상 등 웹의 구조를 담당 ex) 얼굴에서 눈, 코, 입, 귀 등 CSS (Cascading Style Sheets) - 디자이너의 영역 실제 화면에 표시되는 방법(색상, 크기, 폰트, 레이아웃 등)을 지정해 콘텐츠를 꾸며주는 시각적인 표현(정적)을 담당 ex) 얼굴에서 눈, 코, 입, 귀 등의 위치나 크기, 색상 등 JS (JavaScript) - 개발자의 영역 콘텐츠를 바꾸고 움직이는 등 페이지를 동작시키는 동적 처리를 담당. ex) 얼굴에서 각 이목구비의 기능, 피부를 눌렀을 때 나오는 탄성 등 -------------------------------------------- HTML..