웹페이지 기획 5주차

1. 2-1의 스마트폰 어플 페이지를 만들었다.

어플은 구글스토어 기준으로 6가지 어플을 작성했고, 어플에 대한 간단한 소개를 옆에 작성했다.

• 제목은 스마트폰 어플로 정했다.
• background image를 선택하여 코드를 작성해주고 body 태그의 font-size와 margin을 작성했다.
• a 태그도 지난 주 과정과 같이 작성했다.

​

• class인 shadow를 지난 주 과정과 같이 작성했다.
• 본문에 들어갈 내용을 위해 새로운 클래스인 fontlist를 정의해 텍스트의 색과 정렬을 정해주었다.
• 새로운 클래스인 ffont을 정의해 각 어플에 대한 설명을 작성하는 텍스트의 크기와 색상을 정했다.
• 새로운 클래스인 title을 정의해 제목인 집사들을 위할 스마트폰 추천 어플은 가운데 정렬을 했다.

​

• 본문의 내용을 a태그, fontlist와 ffont클래스를 이용해 작성했다.
• 어플 이름과 설명 텍스트 클릭 시 구글 플레이스토어 어플 소개 창으로 화면이 전환된다.
• 바탕 페이지 클릭 시 첫화면으로 이동하도록 해주었다.

​

​

​

2. 2-1로 가는 클릭 페이지를 만들었다.

• 제목은 댕냥이와 함께 살고 있어요 로 정했다.
• background image를 선택하여 코드를 작성해주고 body 태그의 font-size와 margin을 작성했다.
• a 태그도 지난 주 과정과 같이 작성했다.
• class인 shadow를 지난 주 과정과 같이 작성했다.

​

• button 이라는 class를 정의했다.
• button2라는 class를 정의했다.

• 각 버튼을 클릭하면 이동하도록 a태그를 달아주고 button과 button2 클래스를 사용해 24시 병원과 스마트폰 어플로 이동하는 버튼을 만들었다.

​

​

 

결과)

2-1 스마트폰 어플

​

2-1클릭페이지

​