본문 바로가기

html14

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.
JavaScript 실습예제 - Lotto JavaScript 코드 효율화 안녕하세요. Hynn 입니다. 이전 포스팅에서 코드의 효율성을 위해 JavaScript 를 효율적으로 작성하기 위한 예제를 게시한 바 있습니다. 이번 포스팅에서는 효율적으로 작성한 JavaScript 코드를 작성하는 방식에 대해서 해설이 있다면, 저도 기억하기가 좋고, 다른 분들께서도 좋은 참고자료가 되었으면 합니다. 그럼 시작해보겠습니다. ============== 1. JavaScript 작성 2. 해설본 ============== 1. JavaScript 작성 const btn = document.querySelector('#submit') const LottoDisplay = document.querySelector('#lottonum') const LottoBox = document.queryS.. 2022. 11. 10.
JavaScript 실습예제 - Lotto 번호 생생 웹 페이지 만들기 안녕하세요. 이전 포스팅에서 작성한 여러개의 기능을 사용하여, 이제 Lotto 번호 생성기를 만드는 예제를 작성해보겠습니다. 각 페이지 단계별로 설명을 첨부하였으니, 참고하시면 도움이 될 것이라고 생각합니다. 그리고, 코드를 조금 더 간추린 버전을 설정하여, 페이지 하단에 기재했으니, 참고하시면 좋을 거 같습니다. 이에 대해서는 별도의 설명을 하지 않겠습니다. ========================== 1. Lotto 번호 만들기 - HTML 2. Lotto 번호 만들기 - CSS 3. Lotto 번호 만들기 - JavaScript 4. 코드 정리하기 ========================== 1. Lotto 번호 만들기 - HTML 먼저 HTML은 간촐하게 작성합니다. 먼저 영역을 설정하기 .. 2022. 11. 10.
HTML/CSS - Display Flex 에 관하여 안녕하세요. Hynn 입니다. Display 속성에서 이전에 Block, Inline, Inline-block 에 대해서 다루었던 적이 있습니다. 하지만 별도로 이 포스팅을 작성하는 이유는, 기존의 Block, Inline 에 이어서, 이 개념은 별도로 작성해야, 이해가 더 좋을 것이라고 생각되어 별도 작성을 하게 되었습니다. 작성자가 가장 중요하게 HTML/CSS 에서 생각하는 점은, 컨텐츠의 작성방법도 중요하지만, 본질적으로 가장 중요한 영역은 Layout 을 설정하는 단계가 가장 중요하고, 이 단계가 완벽히 이루어져야, 이후의 Contents 작성에서 스스로 진행을 하기가 가장 원활하다고 판단되기 때문입니다. 그럼 Display Flex 에 대해서 알아보도록 하겠습니다. ===============.. 2022. 10. 28.
HTML/CSS 따라하기 기본 Naver 회원가입 페이지 Clone - Footer 안녕하세요 Hynn입니다. 이제 마지막 단계만을 남겨두고 있습니다. Footer 라고 하는 영역은, 특별한 정보라기 보다는, 각 회사의 이용약관,정보 및 연락처등이 포함된 Information 영역입니다. 하지만 이전에 Block 성질의 Element 를 학습하면서, 이러한 유형들을 몇가지 살펴본 바 있습니다. 그 중 Header, Footer 는 일반 홈페이지에서도 많이 보이는 영역이기 때문에, 용어에 익숙해지면 도움이 되리라 생각합니다. 원래는 어제 업로드가 됬어야 했지만 몸의 신호로 긴급하게 병원을 다녀오다 보니 작성이 늦었습니다. 그럼 마무리해보도록 하겠습니다. ================================================================== 1. Footer.. 2022. 10. 28.

티스토리툴바