본문 바로가기

html, css, 자바스크립트/html35

html fieldset, legend 태그 이용하여 폼 요소 그룹핑 하기 html fieldset, legend 태그 이용하여 폼 요소 그룹핑 하기 네 안녕하세요, 이번 포스팅에서는 폼 요소를 그룹핑하는 방법에 대하여 알아보도록 하겠습니다. 폼 요소를 그룹핑 한다는 것은 여러 가지의 폼 요소들을 하나의 설문지와 같은 형태의 양식으로 큰 묶음으로 정리하여 나타내는 것을 말합니다. 이러한 것은 특히 회원 가입 페이지 등을 만들 때 필요한데, 이를 어떤 식으로 만드는 지 한 번 알아보도록 하겠습니다. 1. 폼 요소 그룹핑 하기 : fieldset, legend 태그 이용 그리고 이런 정보 입력 칸을 좀 더 깔끔하게 만드는 방법이 있습니다. 바로 그것들을 그룹핑을 하는 것입니다. 그렇게 되면 좀 더 깔끔한 화면이 만들어지고, 시인성이 좋아지겠죠? 그래서 그럴 때 사용하는 태그는 fi.. 2023. 3. 10.
html type 속성과 placeholder 속성을 이용하여 정보의 힌트 및 양식 보여주기와 형식을 가진 텍스트 입력하기 html type 속성과 placeholder 속성을 이용하여 정보의 힌트 및 양식 보여주기와 형식을 가진 텍스트 입력하기 네 안녕하세요, 이번 포스팅에서는 html을 이용해서 폼 요소에 입력하는 정보의 양식을 제공 받게 하고, 형식을 가진 텍스트를 입력하는 것을 한 번 해보겠습니다. 우리가 보통 폼을 이용해서 만드는 것들은 로그인 화면 같이 무언가를 입력을 하는 창입니다. 그런데 그러한 정보 입력 칸들이 중구난방하면 시인성이 떨어지기 때문에 사용자들이 불편함을 느낄 수가 있습니다. 그래서 그러한 경우가 발생하지 않도록 폼 요소들을 묶어주는 겁니다. 그래서 이번 시간에는 어떤 식으로 폼 요소들에 대한 양식을 제공하며, 그리고 폼 요소에 부가적으로 추가하면 좋은 기능들이 어떤 것들이 있는지 한 번 알아보도.. 2023. 3. 10.
html number, range 속성을 이용하여 스핀 버튼과 슬라이드 바 사용하기 html number, range 속성을 이용하여 스핀 버튼과 슬라이드 바 사용하기 네 안녕하세요, 이번 포스팅에서는 스핀 버튼과 슬라이드 바를 사용하는 방법에 대해서 알아보도록 하겠습니다. 스핀 버튼과 슬라이드 바는 웹을 꾸미기에 아주 적합한 요소인데, 정말 어지간한 사이트들에는 다 들어가 있는 기능이 스핀 버튼과 슬라이드 바입니다. 그만큼 썼을 때 이목을 집중시키기가 쉽고, 매우 직관적으로 요소나 수치 등을 표현할 수 있어서 정말 많이 씁니다. 그럼 지금부터 이들을 어떻게 사용을 할 수 있는지 알아보도록 하겠습니다. 1. 스핀 버튼과 슬라이드 바로 편리한 숫자 입력하기 : number, range 속성 이용 이번에는 스핀 버튼과 슬라이드 바로 좀 더 시각적인 요소들을 넣어보겠습니다. html에서는 정.. 2023. 3. 7.
html month, week, date, time, datetime-local 속성 이용하여 시간 표현하기 html month, week, date, time, datetime-local 속성 이용하여 시간 표현하기 네 안녕하세요, 이번 포스팅에서는 html로 시간 정보를 입력하는 방법에 대하여 알아보도록 하겠습니다. html에서는 시간에 대한 정보도 제공을 해주는데요, 이 시간 정보를 활용을 할 데가 정말 많기 때문에 html 요소들 중에 가장 중요한 요소들 중 하나라고 생각을 합니다. 우리가 지도나 gps 등을 이용을 할 때도 위치 정보 외에 시간에 관한 정보도 받아 실시간으로 계속 전송을 하는 것이기 때문에, 시간 정보의 가치는 꽤나 중요하다는 것을 알 수가 있습니다. 그래서 이러한 시간 정보들을 html에서는 어떻게 제공을 해주는지 한 번 보도록 하겠습니다. 1. 시간 정보 입력하기 : input ty.. 2023. 3. 7.