본문 바로가기

개발공부일지/HTML7

HTML - Form Element 다루어보기 안녕하세요. Hynn 입니다. 이제 실습형태의 HTML 사용이 아니라면, 이번 포스팅이HTML 에서는 마지막 포스팅이 되지 않을까 합니다. 제가 작성한 내용은 어디까지나 Element 나 개념의 대한 기초학습용으로 작성한 것이다 보니, 내용의 질에서 보다 응용적인 측면을 보시고자 하시는분들이라면, 이후에 실습형태의 포스팅을 봐주시면 더욱 감사하겠습니다. 마지막으로 작성하는 Form Element 에 대해서 다루어보도록 하겠습니다. ======== 1. Form Element 사용하기 2. 기본 구성도 3. 작성 예제 ======== 1. Form Element 사용하기 Form Element 는 div 만큼이나 사용이 잦은 Element 입니다. 단어 그대로 Form Element 는 웹 사이트에서 사용.. 2022. 11. 22.
HTML/CSS - Table 을 사용하여 표 만들기 안녕하세요. Hynn 입니다. 이번 포스팅에서는 HTML/CSS 기능을 활용해서 표, 그리고 웹 페이지에서 자주 보던 게시판을 구현해보도록 하겠습니다. 게시판 구현에 사용되는, HTML Element, CSS 기본 활용을 포함하고 있으며, 이 활용은 가장 기초적인 방법을 사용하였으므로. 실제 방법은 더 다양하고 ,간결할 수 있습니다. 그럼 시작해보겠습니다. =========== 1. 표, 게시판 사용에 이용되는 Element 2. HTML - 기본 작성 예제 3. CSS - 기본 작성 예제 =========== 1. 표, 게시판 사용에 이용되는 Element Element 명칭 설명 Table Element 를 사용하여 행과 열로 이루어진 표를 나타냅니다. Table 에서 행을 만듭니다. Table 에서.. 2022. 11. 21.
HTML/CSS - Display Flex 에 관하여 안녕하세요. Hynn 입니다. Display 속성에서 이전에 Block, Inline, Inline-block 에 대해서 다루었던 적이 있습니다. 하지만 별도로 이 포스팅을 작성하는 이유는, 기존의 Block, Inline 에 이어서, 이 개념은 별도로 작성해야, 이해가 더 좋을 것이라고 생각되어 별도 작성을 하게 되었습니다. 작성자가 가장 중요하게 HTML/CSS 에서 생각하는 점은, 컨텐츠의 작성방법도 중요하지만, 본질적으로 가장 중요한 영역은 Layout 을 설정하는 단계가 가장 중요하고, 이 단계가 완벽히 이루어져야, 이후의 Contents 작성에서 스스로 진행을 하기가 가장 원활하다고 판단되기 때문입니다. 그럼 Display Flex 에 대해서 알아보도록 하겠습니다. ===============.. 2022. 10. 28.
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.