웹 10일차

안녕하세요 7조 서정우 입니다.

저희는 MBTI맞춤 여행 어플을 기획 했습니다.

우선 타겟으로는 ~~~

다음으로 불편한점으로는 MBTI에 대한 한국인의 선호도가 엄청 높은 시국에 MBTI 맞춤여행 어플이 없었고 여행계획을 짜기 힘들어하는 분들이 종종 있었습니다. 

그리고 K-POP, K FOOD 등등 한국으로 여행오는 
외국이 많아지는 요즘 언어로 인해 여행중 오는
불편함이 많아지고 있다고 알게 되었습니다.

다음은 비슷한 유형의 여행계획을 해주는 어플들이  일정이나 동선들이 너무 단조롭고 불편하다는 후기를 접하였습니다. 

그리고 휴가철에 친구들이나 가족 등 여행 갈때 
여행 계획이 서로 달라서 어려움을 겪는 상황이
많이 생기지 않나요? 의견이 달라서 한고집 하는 사람들끼리 대립하다보면 심하면 손절하게 되는 경우까지 가는 상황이 생길 수 있습니다.

 

[앵커태그]

- 클릭했을때 원하는 경로로 이동할 수 있게 해주는 태그

- 요소가 있어야 클릭해서 이동할 수 있다. 

- 기본적으로 herf라는 속성이 생성된다.

ㄴ 기본적으로 target이라는 속성이 작동되고 있다.

ㄴ기본값:_self(내가 보고있는 페이지가 바뀌면서 경로 이동)

ㄴ_blank(새 탭이 열리면서 경로 이동)

- title속성을 사용할 수 있다.

ㄴ 형태) title=""

ㄴ""안에 원하는 문구를 입력해주면 마우스를 올렸을때 말풍선으로 표시 해준다.

ㄴ여는 태그 엘리먼트 닫는태그

 <a> 엘리먼트 </a>

-이동할 링크가 정해지지 않았다면 herf속성값으로 꼭 #을 작성 해줘야한다.

 

[none값]

-없앤다.

 

[flex]

-flex속성값이 적용된 태그를 flex-container라고 부른다.

-flex-container 자식을 flex-item이라고 부른다.

-flex-item은 줄바꿈 되라는 코드가 적용되기 전까지 절대 줄바꿈되지 않는다.

ㄴ줄어들 수 있을때까지 유연하게 계속 줄어든다.

- flex-item을 한번에 정렬하는 속성은 flex-container에 적용한다.

- flex-item을 개별적으로 커스텀 할 수 있는 속성은 flex-item에 적용한다.

ㄴalign-self,flex-grow,flex-basis

 

[align-item와 flex-item높이]

- align-item : stretch;

ㄴheigt:auto=100%

 

- align-item : 그 외 값;

ㄴheigt:auto=0%

 

[align-item] 세로정렬 속성

- stretch값을 제외하곤 flex-item높이를 강제로 작게 줄여서 이동 정렬 시킨다.

*flex는 생략하고 작성할 수 있다.

ㄴ 예시 ) align-items:start;

 

상단정렬)

align-items: flex-start;

중앙정렬)

align-items : center;

하단정렬)

align-items: flex-end;