728x90 🧱 언어 모음집/CSS66 [CSS] 반응형 헤더 만들기 // index.html DreamConding Home Gallery Weddings FAQ Bookings // style.css body { margin: 0; font-family: "Noto Sans KR", sans-serif; } a { text-decoration: none; color: white; } .navbar { display: flex; justify-content: space-between; /* 가로 정렬 */ align-items: center; /* 세로 정렬 */ background-color: #263343; padding: 8px 12px; } .navbar__logo { font-size: 24px; color: white; } .navbar__logo i { co.. 2021. 12. 19. [CSS] div 영역 나누기 아래 사이트를 참고하면 될 것 같다. 위 그림은 다른 팀원분이 알려주신 내용을 토대로 정리 해봤다. 꿀팁 display: flex 속성은 부모 컴포넌트에서 자식 컴포넌트에만 적용되고 부모 컴포넌트에서 자손 컴포넌트에는 적용이 안된다고 한다! https://rgy0409.tistory.com/98 [CSS 기초] DIV 태그를 이용하여 프레임 나누기 [CSS 기초] DIV 태그를 이용하여 프레임 나누기 안녕하세요~ 친절한효자손 이에요. CSS를 이용하여, 프레임을 나누는 실습을 하고 있는데요, 이거 생각보다 쉽지만은 않지만, 재.미.있.네.요! ㅎㅎㅎ rgy0409.tistory.com https://jhost.tistory.com/74 [CSS] div 태그를 이용해서 프레임 나누기 예제 코드 Inser.. 2021. 12. 14. [CSS] Flexbox 잘 다루는 방법, 이미지 넓이에 맞춰서 출력하는 방법 - Flexbox 잘 다루는 방법 : 팀원분이 Flexbox Froggy를 해보셨는 데 CSS 잡는 데 도움이 많이 되셨다고 해서 사용 해봤다! https://flexboxfroggy.com/#ko Flexbox Froggy A game for learning CSS flexbox flexboxfroggy.com - 이미지 넓이에 맞춰서 출력하는 방법 : 게시물 작성 시 이미지를 업로드 하면 미리보기를 통해서 사용자가 업로드한 이미지를 출력 할 수 있도록 만들었습니다. 이미지 크기에 상관없이 잘리는 부분 없이 보여 줄 수 있도록 background-image CSS 코드를 사용 했습니다. background-image: url("이미지 주소"); background-size: contain; backgr.. 2021. 12. 7. 이전 1 ··· 5 6 7 8 다음 728x90