티스토리

성장 기록.zip

검색하기

블로그 홈

성장 기록.zip

nijy.tistory.com/m

아-니지 님의 블로그입니다.

구독자: 1

방명록 방문하기

주요 글 목록

모든 태그에 공통으로 사용 가능한 속성 종류 (글로벌 속성) 태그에 공통으로 사용할 수 있는 태그는 무엇이 있을까? 글로벌 속성 --글로벌 속성은태그 종류에 상관없이 모든 태그에서 공통으로 사용할 수 있는 속성을 의미한다. -- class 속성 --요소에 클래스명을 지정할 때 사용하며해당 클래스명은 CSS에서 클래스 선택자로 활용하고, 같은 클래스명은 여러 요소가 중복하여 가질 수 있다. 기본 형식 . . . -- id 속성 --요소에 아이디를 지정할 때 사용되며아이디는 CSS에서 아이디 선택자로 활용하며, 중복된 값은 사용할 수 없다. 기본 형식 . . . -- style 속성 --CSS 코드를 인라인으로 작성할 때 사용된다.-- title 속성 --요소에 추가 정보를 넣을 때 사용된다.(요소에 마우스를 올리면 툴팁으로 표시된다.).. 공감수 1 댓글수 0 2025. 2. 24.
웹 페이지 구조 설계에 관련된 태그 (시맨틱 태그) 웹 페이지는 어떻게 구조를 설계할 수 있을까? 시맨틱 태그 (Semantic Tag) --시맨틱(Semantic)은 사전적으로 "의미론적"이라는 뜻으로시맨틱 웹은 더 의미 있게 웹페이지를 설계하는 트렌드라고 볼 수 있다. 이러한 트렌드에 맞춰 시맨틱 태그를 사용한다. 시맨틱 태그는HTML5에서 도입된 태그들로, 콘텐츠의 의미와 역할을 명확하게 설명하는 태그로태그의 이름만으로 "태그"와 "용도", "역할"에 대한 의미가 명확한 태그를 의미하고사람뿐만 아니라 검색 엔진과 스크린 리더도 콘텐츠 구조를 쉽게 이해할 수 있어가독성과 접근성이 향상되고, 검색 엔진 최적화에도 유리하다. HTML5 이전에는대표적으로 "table 태그", "form 태그", "a 태그" 등을 시맨틱 태그에 속했고"div 태그".. 공감수 0 댓글수 0 2025. 2. 22.
멀티미디어 관련 태그 미디어에 관련된 태그는 무엇이 있을까? audio 태그 --audio 태그는음성에 대한 미디어를 나타내는 태그로항상 "src 속성"과 함께 사용하여 "src 속성"에 오디오 파일의 경로를 정의한다.그리고 오디오 컨트롤러 패널이 웹 브라우저에 노출될 수 있도록 "controls 속성"을 추가한다. 기본 형식 예시 코드-- video 태그 --video 태그는비디오 요소를 나타낼 때 사용된다.이 또한 "audio 태그"처럼 "src 속성"과 "controls 속성"을 사용할 수 있다. 기본 형식 예시 코드-- source 태그 --source 태그는"audio 태그"와 "video 태그"에서 리소스(파일)의 경로와 미디어 타입을 명시하는 데 사용된다. 기본 형식 -- 공감수 0 댓글수 0 2025. 2. 22.
표 관련 태그 표에 관련된 태그는 무엇이 있을까? table 태그 & caption 태그 & tr, th, td 태그 --table 태그는표를 생성할 때 사용하며, 표와 관련된 태그는 모두 table 태그 안에서 사용된다. 기본 형식 caption 태그는표를 생성할 때 웹 접근성을 향상시키는 방법 중 하나로, 해당 테이블(표)의 제목을 정의한다.이때 해당 제목은 표를 기준으로 가운데 정렬된다.(caption 태그를 사용할 때는 table 태그 안에서 첫 번째로 작성해야 한다.) 기본 형식 표 제목 tr 태그는표에서 행을 생성하며, 여러 개 생성도 가능하다. 기본 형식 th 태그와 td 태그는표에서 열을 생성할 때 사용하며 "th 태그"는 표에서 제목을, "td 태그"는 표에서 일반적인 데이터를 .. 공감수 0 댓글수 1 2025. 2. 21.
상호작용(form) 관련 태그 상호작용하기 위한 태그는 무엇이 있을까? form 태그 --form태그는폼 양식을 의미하는 태그로폼을 구성하는 태그는 모두 from 태그 안에 작성해야 한다. 폼(from)은 HTML에서 사용자와 상호작용을 통해 정보를 입력받고 서버로 전송하기 위한 양식을 의미한다. 기본 형식action 속성폼 요소에서 사용자와 상호작용으로 입력받은 값들을 전송할 서버의 URL 주소를 적는다.method 속성입력받은 값을 서버에 전송할 때 송신 방식을 작성한다.속성 값으로는 "get" 또는 "post"를 사용할 수 있다. actions 속성과 method 속성을 같이 사용할 수 있으며해당 속성들은 서버에서 처리하므로 서버 영역 개발자가 작성하거나 알려준다.-- input 태그 --input 태그는아이디나 .. 공감수 1 댓글수 1 2025. 2. 19.
텍스트 관련 태그 텍스트 관련 태그는 무엇이 있을까? hn 태그 --hn 태그는제목이나 주제를 나타내는 텍스트를 표현할 때 사용된다.n은 숫자를 의미하고 1 ~ 6까지 존재한다. (h1 ~ h6) 기본 형식 제목 예시 코드 해당 내용은 제목1 입니다. 해당 내용은 제목2 입니다. 해당 내용은 제목3 입니다. 해당 내용은 제목4 입니다. 해당 내용은 제목5 입니다. 해당 내용은 제목6 입니다. "hn태그"로 작성된 텍스트는 "검색 엔진"에서 키워드로 인식하므로검색 엔진 최적화를 위해 본문에서 핵심이 되는 내용으로 제목이나 주제를 잘 선택해서 작성해야 한다. 검색 엔진은hn태그를 검색할 때 h1태그부터 단계적으로 검색한다.만약 h4태그를 사용하지 않고 h1, h2, h3, h5, h6 태그를 사용하고 있.. 공감수 0 댓글수 0 2025. 2. 18.
링크 및 이미지 관련 태그 링크 및 이미지는 어떤 태그를 사용할까? a 태그 --a 태그는 HTML에서 내부 또는 외부에서 링크를 생성하여웹 문서에서 다른 페이지, 파일, 이메일, 전화번호 등으로 연결할 때 사용하는 태그로대상 경로를 의미하는 "href 속성"은 필수로 사용하고, 그 외에 "target 속성", "title 속성"을 선택해서 사용할 수 있다. href 속성은a 태그로 생성하는 링크의 대상 경로를 입력할 때 사용한다.href 속성 값은 대상 경로의 주소(URL)이거나 내부 문서의 id 속성 값일 수 있다.만약 대상 경로가 명확하지 않아 잠시 보류할 때에는 대상 경로 대신 "#"를 넣으면 연결되지 않는다. 링크 target 속성은a 태그로 링크를 생성할 때 대상이 연결되는 방식을 지정할 때 사용한다.속성 값 .. 공감수 0 댓글수 0 2025. 2. 17.
목록 관련 태그 목록에 관련된 태그들은 무엇이 있을까? ul 태그 (+ li 태그) --ul 태그는 순서가 없는 비순서형 목록을 생성하는 태그이며,해당 목록의 내용은 li 태그를 사용한다. 기본 형식 목록 내용 1 목록 내용 2 목록 내용 n 예시 코드공부 중인 언어 자바 자바스크립트 코틀린-- ol 태그 (+ li 태그) --ol 태그는 순서가 있는 순서형 목록을 생성할 때 사용하며해당 태그의 목록의 내용은 li 태그를 사용한다. 기본 형식 목록 내용 1 목록 내용 2 목록 내용 n 예시 코드오늘 할일 아침 스트레칭 점심 공부 저녁 헬스-- dl 태그 (+ dt태그, dd 태그) --dl 태그는 정의형 목록을 만들 때 사용하며목록의 내용에는 dt 태그와 d.. 공감수 1 댓글수 1 2025. 2. 15.
그룹 관련 태그 그룹 관련된 태그는 무엇이 있을까? 그룹 짓기 --HTML 코드를 작성하다 보면 관련 있는 요소들을 그룹으로 묶어야 하는 경우가 많이 존재한다. 위 그림(네이버)처럼 "검색 영역", "로그인 영역", "사이드 배너 영역", "신문 기사 영역" 등관련 있는 요소끼리 그룹이 지어져 있다. 웹 페이지를 만들 때 관련 있는 요소끼리 그룹으로 묶으면 레이아웃을 구성하기 쉬워지며,HTML 페이지의 구조를 더욱 깔끔하게 구성할 수 있다. 그룹 짓기 작업은 일반적으로 "div 태그"와 "span 태그"로 수행하며,이러한 태그를 "공간 분할 태그"라고 부른다.-- div 태그 --div 태그는블록 요소와 인라인 요소를 그룹으로 묶을 때 사용된다. 기본 형식 예시 코드ㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁAAAAA.. 공감수 0 댓글수 0 2025. 2. 14.
HTML 기본 구성 HTML은 기본적으로 어떤 것들로 이루어져 있을까? 기본 틀 -- 나의 첫 번째 웹 페이지 -- 태그 --태그는웹 페이지를 구성하는 요소를 정의하는 역할로HTML 문법을 이루는 가장 작은 단위다. 기본 형식홑화살괄호() 사이에 태그명을 넣는 형태로 이루어져 있다. 예시-- 속성 --속성은"태그"에 어떤 의미나 기능을 보충하는 역할로 사용한다. 즉, 기존 태그에 대해 보충하는 의미로사용을 해도 되고, 안 해도 되고, 여러 개를 사용해도 된다.단, 태그 없이 단독으로는 사용이 불가능하다. 기본 형식보충할 태그의 홑화살괄호() 안에 작성하며, 여러 개를 작성할 때 콤마(,) 구분 없이 띄어쓰기로 구분한다. 예시만약 태그만 사용한다면 그저 "HTML 문서의 시작"이라는 의미지만lan.. 공감수 0 댓글수 0 2025. 2. 13.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.