Q. CSS를 HTML에 적용하는 3가지 방법은?
① 인라인(Inline): 태그의 style 속성에 직접 작성.② 내부(Internal): <head> 안에 <style> 태그로 작성.③ 외부(External): 별도 .css 파일을 <link> 태그로 연결.
Q. 외부 스타일시트를 연결하는 태그 작성법은?
<link rel="stylesheet" href="style.css"><head> 안에 작성한다.rel="stylesheet": 연결 파일이 스타일시트임을 명시.href: CSS 파일 경로.
<link rel="stylesheet" href="style.css">
rel="stylesheet"
href
Q. CSS 기본 문법 구조는?
선택자 { 속성: 값; }선택자(selector): 스타일을 적용할 HTML 요소 지정.속성(property): 변경할 스타일 항목 (예: color).값(value): 속성에 할당할 내용 (예: red).
선택자 { 속성: 값; }
Q. CSS 선택자 5가지 종류와 문법은?
요소 선택자: p { } — 해당 태그 전체 선택클래스 선택자: .menu { } — class 속성으로 선택태그+클래스: h1.title { } — 특정 태그의 특정 클래스ID 선택자: #wrap { } — id 속성으로 선택 (페이지에서 유일)전체 선택자: * { } — 모든 요소 선택
p { }
.menu { }
h1.title { }
#wrap { }
* { }
Q. 클래스 선택자와 ID 선택자의 차이는?
클래스 선택자 (.클래스명): 여러 요소에 동일 클래스 재사용 가능.ID 선택자 (#아이디명): 페이지 내에서 유일한 요소 하나에만 사용.ID는 중복 사용 시 HTML 오류이므로 레이아웃 구역에 주로 사용.
.클래스명
#아이디명
Q. color, background-color, font-size, text-align, padding 속성의 역할은?
color: 글자 색상background-color: 배경 색상font-size: 글자 크기 (px, em, % 등)text-align: 텍스트 정렬 (left·center·right)padding: 요소 안쪽 여백
color
background-color
font-size
text-align
padding
Q. h1.title { color: blue; }는 어떤 요소에 적용되나?
h1.title { color: blue; }
태그+클래스 선택자로, <h1 class="title">에만 적용된다.<p class="title">에는 적용되지 않음.특정 태그의 특정 클래스에만 스타일을 줄 때 사용.
<h1 class="title">
<p class="title">
Q. HTML5 시맨틱 태그 7가지와 각 역할은?
<header>: 페이지·섹션 머리글 (로고, 제목)<nav>: 주요 내비게이션 링크 묶음<main>: 문서의 핵심 콘텐츠 (페이지에서 1개)<section>: 주제별 콘텐츠 구역<article>: 독립적으로 배포 가능한 콘텐츠<aside>: 부가 정보·사이드바<footer>: 하단 정보 (저작권, 연락처)
<header>
<nav>
<main>
<section>
<article>
<aside>
<footer>
Q. <section>과 <article>의 차이는?
<section>: 주제별 구역 구분. 페이지 내부 일부로서 맥락에 종속됨.<article>: 독립적으로 의미가 완결되는 콘텐츠.(블로그 포스트, 뉴스 기사 등은 article; 페이지 구역 나누기는 section)
Q. <div>와 시맨틱 태그의 차이는?
<div>: 의미 없는 컨테이너. 레이아웃 목적으로만 사용.시맨틱 태그: 역할·의미를 담아 검색엔진 최적화(SEO), 접근성(스크린 리더), 코드 가독성을 높임.가능하면 div 대신 의미에 맞는 시맨틱 태그 사용 권장.
<div>
Q. 시맨틱 태그에 클래스를 함께 사용하는 이유는?
시맨틱 태그는 구조·의미를 나타내고, 클래스는 CSS 스타일 적용을 위해 사용.예: <nav class="gnb"> — nav로 내비게이션임을 명시하고, .gnb 클래스로 디자인 스타일 지정.구조와 스타일 역할을 분리하여 유지보수가 쉬워짐.
<nav class="gnb">
Q. 인라인 스타일과 외부 스타일시트 중 어느 것이 우선 적용되나?
인라인 스타일이 가장 높은 우선순위를 가진다.우선순위: 인라인 > 내부 스타일시트 > 외부 스타일시트인라인은 유지보수가 어렵기 때문에, 일반적으로 외부 스타일시트 사용을 권장.