본문 바로가기

디노 code.html12

혼자 공부하는 자바스크립트 예제 정리 inch 를 cm 단위로 변경하기 혼자 공부하는 자바스크립트 직접 해보는 손 코딩 예제 정리 inch를 cm 단위로 변경하기 혼자 자바스크립트를 공부해야 하는 저는 혼자 공부하는 자바스크립트라는 책을 구매하여 읽고 있습니다. 읽는 중에 첫 프로그램을 작성해 보려고합니다. inch를 cm 단위로 변경하기 const rawInput = prompt('inch 단위의 숫자를 입력해주세요') const inch = Number(rawInput) const cm = inch * 2.54 alert(`${inch}inch는 ${cm}cm 입니다`) 저는 미리 html에 js 파일을 연결 해 둔 상태입니다. const상수 "rawInput"은 = prompt질문, 힌트 등을 주어서 말을 하도록 유도하여 사용자에게 입력 받을 수 있는 메서드('inch.. 2021. 8. 10.
웹디자인 기능사 실기 modal layer popup(레이어 팝업) / html css jQuery 웹디자인 기능사 실기 modal layer popup(레이어 팝업) / html css jQuery 웹디자인 기능사의 마지막 modal layer popup만 남았습니다. 오늘 학원에서 테스트를 하는데 html에 팝업을 만들어 놓고, 다른 작업 먼저 하려고 display : none;으로 가려놨다가 깜빡해서 팝업 구현을 안 하고 제출했더라고요. 이 글을 보시는 분들은 조금 거슬리더라도 display: none 하지 말고 작업하시는 거 추천드립니다!! html 소스 팝업 제목 팝업 내용 Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae quo reprehenderit qui harum facilis. Necessitatibus exceptur.. 2021. 8. 10.
반응형 웹 메뉴 만들기 @media css / html css 반응형 웹 메뉴 만들기 @media css / html css 취업을 위해 포트폴리오를 준비 중인데, 국비 지원을 받아 배우는 이 곳에서는 반응형을 알려주지 않았습니다. 오로지 퍼블리셔가 되기 위한 기초적인 것들만을 배우더라구요! 저의 목표는 퍼블리셔를 넘어 프론트앤드가 되는 것이기 때문에 따로 반응형을 공부해봤습니다. html 소스 logo View my work Get to know me Say hello 메뉴 부분을 만들 것이기 때문에 header 시멘틱 태그를 사용했고, Logo를 아직 정하지 않아서 logo라고만 넣어주었습니다. 태그를 이용해서 logo라는 텍스트를 기울여봤습니다. 을 감싸는 박스를 항상 넣었는데 이번엔 반응형을 만들기 위해서 에 직접 class를 넣어주었습니다. 에 제가 포트폴.. 2021. 8. 9.
웹디자인 기능사 실기 탭 메뉴 구현 / html css jQuery 웹디자인 기능사 실기 탭 메뉴 구현 / html css jQuery 웹디 기능사에서 css 소스가 제일 복잡한 구간이 바로 탭 메뉴입니다. 하지만 jQuery 소스가 그만큼 쉬우니 잘 따라오실 수 있습니다! html 소스 공지사항 공지1 공지2 공지3 공지4 공지5 갤러리 html부터 조금 복잡하죠? tab이라는 박스로 감싸주고 제목이 있기 때문에 , , 를 사용해 주었습니다. 는 제목 는 내용 이 둘을 감싸는 이 있다고 생각하면 쉽습니다. 먼저 "공지사항"과 "갤러리" 두 가지의 제목을 탭 했을 때 내용들이 나올 것이기 때문에 에 공지사항과 갤러리를 만들어 주었습니다. 공지사항과 갤러리 둘 중 하나를 눌렀을 때, on이라는 클래스를 이용해 배경색의 변화를 줄 것이기 때문에 첫 번째 에 on 클래스를 주.. 2021. 8. 6.