4전 4전

이번 패스트캠퍼스X야놀자 부트캠프 프론트엔드 과정의 HTML/CSS 과제에 대해 이야기해보려 합니다. 과제 주제 : 자신이 원하는 사이트 레이아웃 클론 1. 클론 한 사이트 클론 한 사이트 https://www.pinkfong.com/ko/index.html Pinkfong Official Website www.pinkfong.com 클론 할 사이트로는 핑크퐁 공식 사이트를 골랐는데 이유는 먼저 레이아웃이 크게 복잡하지 않고, 깔끔한 스크롤 애니메이션이 적절하게 있어서 골랐습니다. 2. 구현한 내용 레이아웃 구성 레이아웃 구성으로는 크게 header, main, footer로 나눠서 작업을 하였습니다. - header 먼저 헤더는 logo, navigation, sotial의 3가지 부분을 dispaly..

태그와 태그는 특정 문장에서 한 부분을 강조하고 싶을 때 사용할 수 있습니다. 두 태그는 비슷하지만 약간의 차이점이 존재합니다. | 강조 먼저 두 태그는 글자를 강조하는 효과를 줄 수 있습니다. 안녕 하세요! 안녕 하세요! HTML 삽입 미리보기할 수 없는 소스 | 차이 1. 태그 안녕 하세요! HTML 삽입 미리보기할 수 없는 소스 먼저 태그는 그냥 해당 태그로 감싼 요소를 아무 의미 없이 찐하게(text-weight: bold) 만들어주는 태그입니다. 2. 태그 안녕 하세요! HTML 삽입 미리보기할 수 없는 소스 태그는 단순 강조보다 더욱 중요하다고 생각하는 텍스트에 사용이 되고, 태그 자체에 중요하다는 의미가 있어서 단순 디자인이 아니라 텍스트에 중요하다는 의미를 포함하고 싶을 때 사용하면 됩니다.

태그의 li는 list의 약자로 말 그대로 리스트를 만들어 주는 태그이고, 태그는 보통 혼자 쓰이는 않고 태그나 태그의 내부에서 사용을 합니다. | 사용 1. 태그 내부에서의 사용 태그는 순서에 상관없는 리스트를 만들어 줍니다. - unordered list의 약자 리스트 1 리스트 2 리스트 3 HTML 삽입 미리보기할 수 없는 소스 2. 태그 내부에서의 사용 태그는 번호와 함께 순서가 있는 리스트를 만들어 줍니다. - ordered list의 약자 리스트 1 리스트 2 리스트 3 HTML 삽입 미리보기할 수 없는 소스

태그와 태그는 특별한 기능이나 의미는 없지만 스타일을 위해 CSS와 함께 쓰이는 아주 중요한 태그라고 합니다. | 차이 1. display 속성의 차이 태그는 display속성이 block이고 태그는 inline입니다. HTML 삽입 미리보기할 수 없는 소스 이처럼 태그는 줄 바꿈이 가능하고 태그는 줄 바꿈이 되지 않습니다. → 태그는 display가 inline속성이라 너비 지정이 안됨 스타 따라서 너비를 지정하려면 display속성을 inline-block으로 바꿔줘야 함

태그는 특정 URL로 연결시켜 주는 하이퍼링크를 만들어주는 태그라고 합니다. | 속성 1. href 태그에 필수로 들어가는 속성으로 연결하고 싶은 주소를 작성하면 됩니다. 블로그 홈페이지로 이동 해당 파일로 이동 2. target 태그로 연결된 창이 어떤 식으로 열릴지 설정하는 속성입니다. 현재 창에서 열림(기본값) 새창에서 열림 현재 창의 부모창에서열림(없으면 _self와 같음) 전체 창에서 가장 최상단에서 열림