전체 글127 HTML/CSS 따라하기 기본 Naver 회원가입 페이지 Clone - Contents 1 안녕하세요. Hynn 입니다. 이전 포스팅에서는 Header 영역을 작성했고, 실제 홈페이지와 유사하게 작성했습니다. 이제 메인무대가 되는 회원가입 부분의 Contents 를 작성해보도록 하겠습니다. 개발자는 아무래도 주어진 언어를 가지고 활용하는 직업이 되는것이니 만큼, 이전 포스팅에서 다루었던 Element 위주로 어떻게 활용이 되었는지를 가지고 작성해보도록 하겠습니다. ================================================================== 1. Contents Part1 - Joinidpw 2. Joinidpw - HTML 3. Joinidpw - CSS ======================================================.. 2022. 10. 25. HTML/CSS 따라하기 기본 Naver 회원가입 페이지 Clone - Header 안녕하세요. Hynn 입니다. 이전 포스팅에서 Layout을 설정했기 때문에, 이제 실제 보여지는 Contents 를 작성해보도록 하겠습니다. 컨텐츠는 이미 이전 포스팅에서 Header, Join_form,Footer 의 3가지 큰 틀로 나누었고, 하나하나씩 분리하여 작성해보도록 하겠습니다. Header 영역에서는 크게 네이버 로고가 표시되고, 로고를 클릭하면, 홈페이지로 이동되는 구조를 가지고 있습니다. 하나의 포스팅에 모든 영역을 작성하면, 글이 길어질 수 있으니, 3가지 영역을 나누어 작성해보도록 하겠습니다. 기존에 다루지않은 Element 에는 각 영역에 설명을 첨부하였으니, 같이 적용해보시면 좋을 거 같습니다. ===============================================.. 2022. 10. 25. HTML/CSS 따라하기 기본 - Layout 설정 안녕하세요. Hynn 입니다. 이번 포스팅에서는 지난 포스팅들의 작성된 Element 와 CSS의 기초개념을 같이 사용하여, 웹 페이지의 Layout을 설정하는 방식의 대한 기본 가이드를 작성하려고 합니다. 이 가이드에서는, CSS에서 가장 기초적으로 사용되는 명령어를 위주로 작성하였고, 기초적인 Layout 만을 작성하기때문에, 그를 토대로 여러개의 포스팅 과정을 거쳐 완성해보도록 하겠습니다. 가장 접근성이 쉬운 사이트 중 Naver의 회원가입 페이지를 바탕으로 작성해보겠습니다. ============================================================================= 1. CSS의 의미 2. 홈페이지 레이아웃 살펴보기 3. HTML 작성 구성도 틀 잡기.. 2022. 10. 24. HTML HTML 기본 개념 정리 및 가이드 - Inline Element 안녕하세요. Hynn 입니다. 이번 포스팅에서는 Block Element 에 이어, In-Line Element 를 정리해보도록 하겠습니다. In-Line Element 의 경우 활용도에 따라 불가피하게 추가적인 Display Porperty 설정을 해야 의도한 대로 작성이 되는 경우가 존재하며, 기본적으로는 Display Porperty 에서 어떠한 성질을 가지고 있는 Element 인지를 이해해야 올바른 작성이 가능합니다. In-Line 속성을 가진 HTML Element 는 이후에 다루게 될 CSS에서 Width(넓이), Height(높이) 를 설정할 수 없습니다. 이를 위해 Display Porperty 설정을 추가로 해야하는데, 본 포스팅에서 같이 다루어보도록 하겠습니다. ============.. 2022. 10. 21. HTML HTML 기본 개념 정리 및 가이드 - Block Element 안녕하세요. Hynn 입니다. 이 글에서는 이전 포스팅에서 설명한 Block과 Inline의 개념을 바탕으로 둔 각각의 Element 를 정리하고, Element 별 주로 사용되는 형태에 대해서 설명하도록 하겠습니다. Block Element 이전 포스팅에서 설명했듯이 한 줄 영역 전체를 차지하는 Block 형태의 Element를 먼저 정리하도록 하겠습니다. 이 Porperty 유형 별의 Element 를 이해하지 않고 사용한다면 HTML로 구현하는 웹 사이트의 영역 정리가 불가할 수 밖에 없기 때문에 사용자는 이를 반드시 인지하고 작성을 해야 올바른 웹 페이지를 구현할 수 있습니다. Block 속성을 가진 HTML Element 는 이후에 다루게 될 CSS에서 Width(넓이), Height(높이) 를.. 2022. 10. 21. HTML 기본 개념 정리 및 가이드 - Block, Inline 알아보기 안녕하세요. Hynn 입니다. 앞선 글 포스팅에 이어서 HTML에서 사용되는 주요 Element 를 정리하고, 사용방식에 대해서 정리하려고 합니다. 다만, 이전 포스팅에서는 항목에 관련된 주요 항목을 정리하였고, 에서 다루는 항목을 정리하고자 하려고 하는데요. 정리하기에 앞서, 에서 사용되는 항목은 반드시 알아야 할 개념을 하나 정리 후 작성하고자 합니다. 1. Block 과 In-Line 은 무엇인가? 2. Block 과 In-Line의 원리 3. Element 유형 및 예제 1. Block과 In-Line은 무엇인가? Block과 In-Line 은 HTML을 올바르게 작성하기 위해서, 반드시 개발자가 알아야 할 특성입니다. 이는 "Display Porperty" 라고도 하는데, 이 속성은 이 주제에서.. 2022. 10. 20. 이전 1 ··· 18 19 20 21 22 다음
