kebab00's

- 사이트를 만들면서 블로그를 적으면서 제목이 좀 이상하다는 것을 느꼈지만 어쩔 수 없었습니다. - 다음엔 좀 더 깔쌈하게 만들어 보도록하죠 ㅎㅎ - 오늘 할 것은 그 동안 만든 것들을 하나로 합쳐주는 일 입니다. - 반응형 까지 해주었습니다. - https://kebab000.github.io/web2023/site/site1/index.html 반응형 보고 싶으시면 해당 주소로 가시면 보실 수 있습니다. - 오늘은 전체 코드를 보는 것 보다 부분부분 코드를 보겠습니다. - 헤드 부분입니다. - CSS는 모두 링크를 통해서 가져오는 형식으로 index.heml은 깔끔하게 해주었습니다. - CSS는 원래의 것들을 가져왔고 미디어쿼리 부분만 이따 보도록 하겠습니다. - SEO라는 처음보는 부분이 보이는데 ..

- 헤더 유형을 만들어 보겠습니다. - 좌측에 로고가 있고 가운데 메뉴부분이 있고 우측 로그인 버튼이 있는 형식입니다. Plant Planner 소개 이로운 점 주의할 점 관리방법 공지사항 연락방법 로그인 - reset 부분은 다른 것들과 비슷합니다. - 로고가 들어갈 div박스 하나와 메뉴가 나열될 a태그들을 li과ul로 감싸서 만들고 로그인 창으로 이동할 a태그가 있는 div 박스를 만들어 줍니다. - CSS 헤드워랩 부분을 보겠습니다. /* header__wrap */ .header__inner { display: flex; justify-content: space-between; align-items: center; padding: 16px; border-bottom: 1px solid #ccc;..

-오늘은 위에 있는 예시처럼 슬라이드 형식의 페이지를 만들어 보겠습니다. - 구조는 6개의 박스에 텍스트가 있는 형식입니다. - 나중에 각 박스를 클릭하게 된다면 해당 내용에 관련된 페이지로 넘어가게 해줄 수도 있습니다. - 일단 코드를 보시죠 NOTICE 식물을 키울 때 유의할 점 적절한 환경 조성 각 식물은 자신만의 적절한 환경을 필요로 합니다. 적절한 온도, 습도, 빛 등을 제공해주어야 합니다. 예를 들어, 대부분의 화분 식물들은 밝은 곳에서 자라는 것을 좋아합니다. 더보기 적절한 수분 공급 대부분의 식물들은 적절한 양의 물을 필요로 합니다. 물 주기는 각 식물마다 다르며, 너무 많이 물을 주거나 적게 물을 주는 것은 식물의 건강에 영향을 미칠 수 있습니다. 더보기 적절한 토양 선택 적절한 토양을 ..

-오늘은 위에 있는 예시처럼 슬라이드 형식의 페이지를 만들어 보겠습니다. - 구조는 커다란 이미지 위에 텍스트가 되어 있는 형식입니다. - 함께 바디부분의 코드를 먼저 보겠습니다. 메인 슬라이드 영역 EVENT 식물과 함께하는 일상 식물을 키우는 것은 건강하고 지속 가능한 생활 습관을 형성하는데 도움이 되며, 자연과의 소통을 이루는 작은 시작이 될 수 있습니다.책상 위에 하나의 작은 식물, 당신의 일상에 작은 변화를 더해보세요 . 자세히 보기 상담 요청 이전 이미지 다음 이미지 첫번째 이미지 두번째 이미지 세번째 이미지 플레이 정지 - 일단 구역을 크게 slider__info, slider__arrow, slider__dot 구역으로 나누어 주었습니다. - 그리고 구역을 각각 채워주면 되는데~!! 어라 ..

- 오늘은 위에 있는 예시처럼 이미지와 텍스트로 이루어진 이미지텍스트타입의 페이지를 만들어 보겠습니다. - 구조는 크게 설명을 적은 텍스트 부분과 이미지로 이루어진 이미지 부분2개가 있겠습니다. - 함께 바디부분의 코드를 먼저 보겠습니다. 이미지&텍스트 영역 NOTICE 수많은 종류의 식물들 많이 기르는 식물의 종류는 지역에 따라 다르지만, 일반적으로 다음과 같은 식물들이 많이 기르고 있습니다. 장미 튤립 백합 카네이션 아몬드 로즈마리 페퍼민트 바질 라벤더 선인장 알로에 - 저는 크게 텍스트가 들어간 부분과 이미지가 들어간 부분 2개 총 3개지 부분으로 나누었습니다. - 텍스트가 들어간 부분에는 , ,,등의 태그를 사용하여 내용을 넣어주었습니다. - reset은 다른 곳에서 쓴 것을 그대로 가져왔습니다...

- 오늘은 위에 있는 예시처럼 이미지들로 이루어진 이미지타입의 페이지를 만들어 보겠습니다. - 구조는 크게 제목을 이루고 있는 헤더 부분과 이미지로 이루어진 컨텐츠 부분이 있겠습니다. - 함께 코드를 보시죠 식물을 키우는 방법 식물을 키우는 것은 생각만큼 쉽지않지만 배운다면 할 수 있습니다. 물을 주는 주기 올바른 주기를 알고 물을 주는 것이 중요합니다. 너무 자주주면 뿌리가 썩을 수도 있기 때문입니다. 자세히보기 광합성의 중요성 올바른 주기를 알고 물을 주는 것이 중요합니다. 너무 자주주면 뿌리가 썩을 수도 있기 때문입니다. 자세히보기 - 자 먼저 body 부분을 보겠습니다. - 먼저 아까 말씀드렸던 것과 같이 제목과 아래 설명부분을 h2와 p태그를 통해 만들어주고 - 이미지가 들어갈 부분을 image..