My Tech Blog (웹디자인)

⚡리스트 태그 사용해서 서브메뉴 만들기 연습⚡ 메뉴에 마우스 올렸을 때 다음과 같이 서브메뉴가 나타나도록 하기 위해 어떻게 코드 작성하는지 알아 보자. - 색깔 입혀주는 css 코드는 별도로 하단에 올려 두었으니 태그 안에  CSS 코드 해설위 CSS 코드의 의미를 살펴보자. 위 코드에서 가장 핵심  2가지는 - submenu가 안보이다가 메뉴바에 마우스를 올렸을때 submenu가 나오게 하는 드롭다운 구현 - 마우스를 올렸을 때 서브메뉴가 부드럽게 나타나도록 함 3-1. 드롭다운 구현 #submenu의 초기 상태: left: 0: 서브메뉴의 왼쪽 위치를 부모 요소의 왼쪽에 맞춤opacity: 0: 서브메뉴를 보이지 않게 설정position: absolute: 서브메뉴를 부모 요소 기준으로 절대 위치to..

1. HTML 유효성 검사(W3C validator), CSS3 기준(W3C Validator) 작성한 HTML코드를 W3C Validator를 통해 검사 했을 때 오류가 없어야 합니다. 태그의 열림, 웹 접근성에 필요한 속성 값을 입력하지 않는 등의 오류를 검사하고 수정하기 위한 검사예요. 인터넷이 되는 상황이라면 유효성 검사는 https://validator.w3.org/ 에서 할 수 있습니다. 하지만 시험장에서는 인터넷 사용이 불가능해서 유효성 검사를 할 수가 없으니 평소에 유효성 검사를 실행해보면서 오류와 경고를 확인하고 수정하는 연습을 충분히 해 보는 게 좋아요.  The W3C Markup Validation ServiceValidate by File Upload Note: file uploa..

✔️ 1. Magazine Design The Daily Work - Webflow HTML website template Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla. the-daily-work-template.webflow.io ✔️ 2. Responsive Yoga Website 피트니스 관련 웹사이트에 역동적인 사람의 이미지 + 도형의 배치 투명한 인물 배경에 여러 가지 도형을 삽입해서 재미있는 효과를 낼 수 있는 점이 마음에 들었다. ..