[HTML][CSS] 면접 기초 질문

Hansol Jeong·2022년 3월 5일
0

Pre-course

목록 보기
14/14

1. HTML이 무엇인가요?

Hyper Text Markup Language 의 약자로, 웹 페이지의 구조를 잡는 언어입니다. 웹 페이지가 알아들을 수 있는 언어입니다.

2. HTML 파일의 필수 구조는 어떻게 되나요?

  • <html></html> : 문서의 시작과 끝.
  • <head></head> : 머리말 부분. 제목이나 CSS 링크, 기본 세팅을 설정하는 부분.
  • <body></body> : 문서의 내용을 입력하는 핵심적인 부분.

3. <img alt="profile" src="이미지 주소"></img> 에서 alt, src를 가리키는 말은 무엇일까요?

alt 는 이미지를 가져오지 못했을 때 표시할 내용이고, src 는 이미지의 주소를 의미합니다.

4. img 태그의 필수 속성을 설명해 주세요.

3번 질문에 대한 답변과 같습니다.

5. CSS는 무엇인가요?

Cascading Style Sheetd 의 약자로, HTML 문서에 디자인을 입혀줍니다.

6. CSS를 적용하는 방법을 최소 2가지 이상 말씀해 주세요.

  • 적용할 html 태그 안에 직접 입력하는 방법
  • head 태그 안에 style 태그 안에 작성하는 방법
  • 별도의 css 파일을 만들고 head 태그 안에서 import 하는 방법

7. margin, padding, border의 영역을 설명해 주세요.

  • border : 태그의 테두리 영역
  • margin : 태그의 테두리 밖 영역
  • padding : 태그의 테두리 안, 내용의 밖 영역

8. block, inline, inline-block의 차이점을 설명해 주세요.

display 속성의 세 종류입니다.

  • block : 해당하는 영역의 줄을 전부 차지하는 element 속성 입니다.
  • inline : 해당하는 영역을 차지하고 줄바꿈 없이 연속되어 배치됩니다.
  • inline-block : inline element 처럼 전후 줄바꿈 없이 한 줄에 다른 element 들과 나란히 배치됩니다. 하지만 inline element에서 불가능하던 width와 height 속성 지정 및 margin과 padding 속성의 상하 간격 지정이 가능해집니다.

9. HTML 태그 중 block 요소 3개, inline 요소 3개를 각각 설명해 주세요.

  • block element : div, section, article
  • inline element : span, a, em

10. 목록과 관련된 태그를 설명해 주세요.

  • ul : 순서가 없는 목록 태그.
  • ol : 순서가 있는 목록 태그. 앞에 숫자가 표시됩니다.
  • li : ul 또는 ol 태그 안에 들어가는 태그입니다.

11. 테이블과 관련된 태그를 설명해 주세요.

  • th : table head 의 약자로, 표의 제목을 쓰는 역할. 굵은 글씨체에 중앙정렬.
  • tr : table row 의 약자로, 가로줄을 만드는 역할.
  • td : table data 의 약자로, 셀을 만드는 역할.

12. 사용자의 입력과 관련된 태그를 설명해 주세요.

  • input 태그 : 입력창 태그입니다.

13. position 속성에 대해 아는대로 설명해 주세요.

position 속성은 기본값으로 static 을 가지고 relative, absolute, sticky 속성을 가집니다. 위치는 top, right, bottom, left 속성으로 조절합니다.

  • relative : 원래 위치 기준으로 얼마나 떨어져 있는 위치에 배치할 지 결정합니다.
  • absolute : 부모 태그를 기준으로 얼마나 떨어져 있는 위치에 배치할 지 결정합니다.
  • sticky : 스크롤을 내려도 고정된 위치에 있도록 배치합니다.
profile
기록해둡시다

0개의 댓글