본문 바로가기

프로그래밍/HTML16

07 <img> 태그_절대경로, 상대경로 태그 img는 image의 약자로 즉, 그림이나 사진을 보여주는 태그 이다. 태그는 종료태그 없이 단독으로 사용된다 위에서 src는 source의 약자로 이미지의 원본 소스의 위치 정보를 받는 곳인데, 위치정보는 절대경로와 상대경로 두가지로 나누어 진다 1) 절대경로 - 고유한 전체 경로이다. - http, https, file에 대한 경로이다. (file 경로는 웹사이트를 만들 때 사용X) 절대 경로로 이미지를 띄워보자 ( •̀ ω •́ )y * 원하는 사이트-> 원하는 사진 우클릭 -> 이미지 주소 복사 * 문법에 맞춰 코드 입력 [결과] 잠깐 ! 여기서 img 태그 내 alt는 무엇일까? 인터넷이 느리거나 파일 경로가 잘못됐을 때 이미지를 대체하는 설명 이외에는 시각장애인 같은 경우, 이미지를 볼 .. 2021. 4. 17.
06 HTML의 속성과 목록 태그 HTML의 속성 속성은 해당 요소에 대한 추가적인 정보를 제공한다. 속성에 대한 값은 따옴표를 꼭 사용하지 않아도 되지만, 속성값에 띄어쓰기가 있을 경우 문제가 발생할 수 있어서 따옴표 쓰기를 권장함 ("쌍따옴표", '따옴표' 둘다 가능) [예시] (O) (X) (O) 목록태그 1) 순서가 없는 목록 태그 [문법] 내용 사용해보자 :) 김사과 오렌지 반하나 이메론 [결과] 2) 순서가 있는 목록태그 [문법] 내용 사용해보자:) 김사과 오렌지 반하나 이메론 [결과] 3. 사용자 정의 태그 [문법] 내용 내용 사용해보자:) 이메론 김사과 오렌지 반하나 [결과] 2021. 4. 17.
05 태그_문단,제목,서식태그 1. 문단태그 : 문단태그란, 내용상 끊어서 구분할 수 있는 부분(문단)을 만드는 태그이다. 시작문장 문단태그 입니다 추가된 문장 결과 시작문장 문단태그 입니다 추가된 문장 브라우저에서 f12를 눌러 관리자모드로 확인해보면 위 아래 여백이 존재하는것을 알 수 있다 2. 제목태그 : 제목 태그란, 제목을 표현할 수 있는 태그로 가장 큰 부터 가장작은 태그까지 제공 한다 안녕하세요 HTML 안녕하세요 HTML 안녕하세요 HTML 안녕하세요 HTML 안녕하세요 HTML 안녕하세요 HTML 결과 3. 서식태그 서식태그는 종류가 굉장히 많지만 그중, , , , , , , 을 알아보자 1) 과 내용 내용 과모두 텍스트를 굵게 표현하고 싶을 때 사용한다. 같은 기능을 가진 태그가 두개나 존재하는 이유가 무엇일까? 태.. 2021. 4. 12.
04 비주얼 스튜디오 코드에서 가로 스크롤이 생길 때 해결법 문장의 길이가 길어지면 아래 이미지와 같이 하단에 스크롤이 생기며 스크롤로 옆으로 넘겨야지만 코드를 확인할 수 있다. 스크롤을 넘겨야만 보이지않는 코드를 확인할 수 있어 불편하다 (´。＿。｀) 같이 해결해보자 1. 파일 > 기본설정 > 설정 클릭 2. 검색창에 wrap 검색 3. Editor : Word Wrap을 On 으로 변경 4. 완성 ! 문장의 길이가 화면크기를 벗어나는 경우 아래 줄로 자동으로 줄바꿈 되는것을 확인할 수 있다 2021. 4. 12.
03 HTML의 특수문자 / 주석문 HTML의 특수문자 띄어쓰기, Enter "HTML은 띄어쓰기와 줄바꿈을 구별하지 않는다. " 안녕하세요 HTML 입니다. 엔터를 쳤어요 띄어쓰기를 위 처럼 많~이 하고 엔터를 쳐도 결과는 아래와 같다. 그렇다면 엔터와 띄어쓰기를 사용하고 싶을 땐 어떻게 해야할까? 바로 아래와 같은 코드로 사용할 수 있다 [문법] Enter : 띄어쓰기 : 적용해보자 ( •̀ ω •́ )✧ 안녕하세요 HTML 입니다. 엔터를 쳤어요 결과 띄어쓰기와 엔터가 잘 적용된걸 확인할 수 있다 :) >(크다), : > (right의 약자) ex) " 태그는 엔터에요" 를 띄우고 싶다면? 태그는 엔터에요--(X) 태그는 엔터에요--(O) HTML의 주석문 HTML 문서에 영향을 주지 않는 설명을 기술하는 구간으로 실행해도 브.. 2021. 4. 12.
02 Visual Studio Code 설치 / 삭제 + 설치하면 좋은 확장 프로그램 / 테마 변경 Visual Studio Code(비주얼 스튜디오 코드) 설치 비주얼 스튜디오 코드는 매우 간단해 설치하는데 전혀 어려움이 없다 :) 1. 아래 URL을 클릭한다 ( 비주얼 스튜디오 코드 내 다운로드 사이트) code.visualstudio.com/download Download Visual Studio Code - Mac, Linux, Windows Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio Code to experience a redefined code editor, optimized for building and debugging .. 2021. 4. 11.
01 HTML이란? HTML이란? HTML은 Hypertext Markup Language 의 약자로 간단하게 말하자면 웹사이트의 틀을 만드는 언어이다. HTML 태그 웹 페이지는 HTML 문서라고도 불리며, HTML 태그들로 구성된다. 각각의 HTML 태그는 웹 페이지의 디자인이나 기능을 결정하는데 사용된다. HTML 태그는 태그 이름을 꺾쇠 괄호()로 감싸서 표현하며 문법은 아래와 같다. 1. // 시작 태그 2. // 종료 태그 HTML 태그는 보통 시작 태그와 종료 태그의 한 쌍으로 구성되며, 종료 태그는 시작 태그와 전부 똑같지만, 태그 이름 앞에 슬래시(/)를 쓰면 된다. 태그에 따라 시작 태그만 있고 종료 태그가 없는 태그(빈 태그 : empty tag)도 존재한다. HTML 작성방법 HTML 문서는 윈도우의 .. 2021. 4. 11.
반응형

티스토리툴바