프론트엔드 챌린지: 12월 에디션 : Glam Up My Markup: Winter Solstice

프런트엔드 챌린지 - 12월 에디션, CSS Art: 12월에 제출한 작품입니다.

영감

이번 챌린지는 동지의 이야기를 들려주면서, 섹션마다 다른 경험을 만들어내려고 노력했습니다. 문제는 추가 div 태그로는 HTML 페이지를 전혀 편집할 수 없다는 점이므로 추가 태그를 삽입하려면 자바스크립트를 사용하는 방법을 찾아야 했습니다.

내 CSS 기술이 녹슬었을 뿐만 아니라 시각적 디자인 기술도 녹슬었습니다.

데모

여기 내 라이브 데모가 있습니다
(https://december24-glamup.vercel.app/christmas.html)

여기 내 코드가 있습니다
https://github.com/aislinngreycat/December-Dress-Up-CSS

이미지는 Unsplash에서 가져온 것이며 ChatGpt를 사용하여 일부 코드를 스캐폴딩했습니다. ChatGPT를 사용하여 샘플 코드를 찾는 것이 얼마나 쉬운지 흥미롭습니다.

여행

약 5(?)년 만에 처음으로 도전하는 종합챌린지이자 첫 CSS 편집입니다. 그 이후로 많은 것이 바뀌었고 이제는 자바스크립트 없이도 많은 시각적 효과가 가능하다는 사실을 알게 되어 기쁩니다.

동지(Winter Solstice)는 종종 "눈"과 연관되지만 반드시 그런 것은 아닙니다. 실제로 크리스마스에 관한 것도 아닙니다. 세계에는 12월 21일이 눈 없이 지나가는 곳도 많고, 크리스마스를 기념하지 않는 문화도 많습니다.
그것은 실제로 지구와 태양의 움직임, 그리고 일광이 어떻게 변화하는지에 관한 것입니다. 그것이 제가 전하고 싶었던 것입니다.

축하 및 전통 섹션은 지금까지 제가 소홀히 다루었던 부분입니다. 축제와 사교 행사 사이에 앞으로 며칠 동안 시간이 있다면 계속해서 작업하고 싶은 작업입니다.

1. 축하 섹션 카드 공개. 마우스를 올리면 카드가 공개되게 하고 싶습니다.

2. 전통섹션은 더 잘할 수 있지만 아직 영감이 좀 필요해요.

읽어주셔서 감사합니다!

위 내용은 프론트엔드 챌린지: 12월 에디션 : Glam Up My Markup: Winter Solstice의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!