오늘 웹사이트를 만들었어요
지난 5일 동안 쌓인 지식을 모아 스타일링에 CSS를 살짝 가미한 기능적인 레시피북 사이트를 만들었습니다.

사이트 링크- Ofameh_Recipe_Site

HTML 코드 블록:

  
    
Ofameh's Recipe Book
    
Breakfast Recipes
          Email   


         Catch Us on X:   Twitter 
         

CSS 코드 블록-

  body {
  font-family: Arial, sans-serif;
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

header,
main,
footer {
  padding: 20px;
  margin: 10px;
}

header {
  background-color: black;
  color: white;
  text-align: center;
}

nav ul {
  list-style-type: none;
  padding: 0;
  display: flex;
  justify-content: space-around;
}

nav ul li {
  margin: 0 10px;
}

section {
  margin-bottom: 20px;
}

article {
  border: 1px solid #ccc;
  padding: 10px;
  margin: 10px 0;
}

img {
  max-width: 100%;
  height: auto;
}

footer {
  background-color: #333;
  color: white;
  text-align: center;
  padding: 10px 0;
}

button {
  display: inline-block;
  padding: 10px 20px;
  font-size: 16px;
  color: black;
  border: none;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  background-color: #ccc;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

button:hover {
  background-color: black;
  transform: translateY(-2px);
  color: white;
} 

이 연습의 전체 요점이 프로젝트 기반 학습이기 때문에 5일차에 지금까지 배운 모든 내용을 종합하여 이를 구축하는 것이 만족스러웠습니다.
실제로 5일 동안 이 작업을 수행하고 그만큼 좋은 사이트를 구축할 수 있다는 것은 나에게 큰 의미가 있습니다.

즉, 6~10일에는 제가 웹사이트라고 부르는 기능을 다루게 되며, 여기서 매일 점점 더 어렵고 복잡해지는 사이트를 구축하게 됩니다.
거기 있어라!