728x90 반응형 스크립트16 [HTML5] 로또추첨기 만들기 #주의# 이 글은 강의 글이 아닙니다 틀린 부분, 깔끔하지 못한 부분 있을 수 있습니다. 지적해 주시면 저도 공부가 되고, 앞으로 이 글을 보실 분들에게도 도움이 될 거라 생각합니다. html 파일 만들기 오랜만에 html 코딩 관련하여 글을 작성합니다. 우선 VSCode를 켜서 파일을 하나 만들어줍니다. lotto.html 로 만듭니다. html:5 작성 하면 아래와 같이 출력됩니다. 부트스트랩 라이브러리를 통해 불러오겠습니다. 다음 body태크에 아래와 같이 작성해주시면 됩니다. 로또 기계 아래 버튼을 클릭하여 45개 중 6개의 숫자를 뽑으세요 로또 추첨 기록 지우기 이해하기 쉽도록 모든 함수에 최대한 주석을 달아두었습니다. 보기 편하실겁니다. 마지막으로 body와 html을 닫아주면 끝입니다. 전체.. 개발 이야기/[HTML5] 2023. 7. 10. 더보기 ›› [HTML5] 웹 메모장 만드는 법 (버튼 깔끔하게 배치하기) #주의# 이 글은 강의 글이 아닙니다 틀린 부분, 깔끔하지 못한 부분 있을 수 있습니다. 지적해 주시면 저도 공부가 되고, 앞으로 이 글을 보실 분들에게도 도움이 될 거라 생각합니다. 개요 이전 포스팅에서 글꼴과 서식에 관한 내용을 다루었습니다. 이번에는 기능이 아닌 버튼을 깔끔하게 배치해 보도록 하겠습니다. 버튼의 위치나 디자인은 사용자에게 편리한 경험을 제공해야 합니다. 보기 좋은 떡이 먹기도 좋다는 말이 있듯이 사용자에게 편리하고 보기 좋게 버튼을 배치하는 것 또한 아주 중요한 것입니다. UX(사용자 경험)와 UI(사용자 인터페이스)는 소프트웨어 개발 및 디자인 분야에서 중요한 개념입니다. UX와 UI는 서로 연관되어 있지만 다른 개념입니다. UX는 사용자의 경험을 전체적으로 고려하고 설계하는 것이.. 개발 이야기/[HTML5] 2023. 5. 26. 더보기 ›› [HTML5] 웹 메모장 만드는 법 (폰트 크기 조절 기능 추가하기) #주의# 이 글은 강의 글이 아닙니다 틀린 부분, 깔끔하지 못한 부분 있을 수 있습니다. 지적해 주시면 저도 공부가 되고, 앞으로 이 글을 보실 분들에게도 도움이 될 거라 생각합니다. 개요 저번 포스팅에서 폰트를 수정할 수 있는 기능을 추가해 보았습니다. 이번에는 폰트 크기를 조절할 수 있는 기능을 추가해 볼 것입니다. 기본적으로 문서나 메모 작성이 가능한 프로그램 및 앱에서는 폰트 변경과 폰트의 크기를 변경할 수 있기 때문에 해당 기능을 추가할 것입니다. 이전 코드 웹 메모장 저장 불러오기 Arial Times New Roman Courier New Verdana 나눔고딕 폰트 크기 조절 기능 추가 해당 기능을 추가하기 위해서는 우선 태그의 select부분을 수정하시면 됩니다. select { back.. 개발 이야기/[HTML5] 2023. 5. 26. 더보기 ›› [HTML5] 웹 메모장 만드는 법 (폰트 선택 기능 추가하기) #주의# 이 글은 강의 글이 아닙니다 틀린 부분, 깔끔하지 못한 부분 있을 수 있습니다. 지적해 주시면 저도 공부가 되고, 앞으로 이 글을 보실 분들에게도 도움이 될 거라 생각합니다. 개요 이전 포스팅에서 저장하면 txt파일로 다운로드할 수 있는 기능까지 구현해 봤습니다. 이제 메모장의 필수 기능인 폰트 선택 기능을 구현해 보겠습니다. 폰트 선택 기능을 추가하기 위해서는 몇 가지 코드만 추가해 주면 됩니다. 이전 코드 아래는 이전 포스팅까지의 코드입니다. 웹 메모장 저장 불러오기 폰트 선택 기능 추가 우선 웹 메모장 저장 불러오기 Arial Times New Roman Courier New Verdana 나눔고딕 개발 이야기/[HTML5] 2023. 5. 26. 더보기 ›› [HTML5] 웹 메모장 만드는 법 (저장해서 txt파일로 다운받기) #주의# 이 글은 강의 글이 아닙니다 틀린 부분, 깔끔하지 못한 부분 있을 수 있습니다. 지적해 주시면 저도 공부가 되고, 앞으로 이 글을 보실 분들에게도 도움이 될 거라 생각합니다. 이전 코드 웹 메모장 저장 불러오기 저장시 txt파일로 다운받기 현재 아래와 같은 모습의 웹 메모장일것입니다. 이제 메모를 작성 후 저장을 누르면 txt파일로 다운로드 받을 수 있는 기능을 넣어볼겁니다. 그럼 개발 이야기/[HTML5] 2023. 5. 26. 더보기 ›› 728x90 반응형 이전 1 2 3 4 다음