Front-End

이경준·2021년 10월 5일

면접

목록 보기

4/4

HTML (구조언어)

웹 페이지의 뼈대 역할

CSS (표현언어)

뼈대를 감싸는 피부 역할

JavaScript (동작언어)

HTML과 CSS를 움직이게 하는 근육 역할

URI = URL + URI

HTML

마크업 언어

웹 브라우저 : 기본적으로 HTML 리더 (HTML을 읽어 사용자에게 보여줌)

태크 : 마크업 할 때 사용되는 약속된 표기법
: 제목 표시
: 텍스트를 굵게 표시
: 일부 텍스트만 묶어 스타일 적용하고자 할 때 사용

,
: 순서가 필요하지 않은 목록 만들기
,
: 순서가 필요한 목록 만들기 , ,
: 각각 표, 행, 셀 생성 : 이미지 삽입 (src 속성을 사용해 이미지 파일 경로를 지정해야 함) : 클릭 시 다른 페이지로 넘어갈 수 있도록 하는 태그 : 특정 항목에 사용자가 뭔가를 입력하는 형태 : form 요소에 레이블을 붙이기 위한 것 : 사용자가 입력하는 부분 *** ## CSS - HTML로 뼈대를 작성하고, CSS로 디자인을 구성 ### 선택자 * : 스타일을 모든 요소에 적용 태그 선택자 : 특정 태그가 쓰인 모든 요소에 스타일 적용 클래스 선택자 : 태그 대신 클래스 이름을 선택하여 지정된 클래스에 스타일 적용
CSS 박스 모델

웹 문서에서 내용 배치 시 각 요소를 박스 형태로 구성하는 것

margin : 현재 요소 주변의 여백

padding : 콘텐츠 영역과 테두리 사이의 여백

시맨틱 태그

태그만 보고도 페이지 구조를 쉽게 이해할 수 있도록 정의된 태그

: 특정 부분의 머리말 : 사이트 안의 문서나 다른 사이트의 문서로 연결하는 링크 모음 : 콘텐츠를 주제별로 묶을 때 사용 : 웹 상의 실제 내용을 넣음 : 본문 내용 외에 주변에 표시되는 기타 내용들을 나타낼 때 사용 (필수 요소 아님) : 웹 문서 제일 하단에 위치하는 태그 : 주로 footer 태그 안에 사용되며, 웹페이지 제작자 정보를 넣는데 사용됨 ***
반응형 웹

사용자가 접속한 다양한 스마트 기기 환경에 따라 제작된 사이트의 레이아웃을 자연스럽게 바꾸어 보여주는 디자인

이경준

The Show Must Go On

이전 포스트

Front-End

면접

HTML

CSS 박스 모델

시맨틱 태그

반응형 웹

Spring

0개의 댓글