html22 자주 쓰는 서브메뉴창 분석: html 구조 및 css 아래와 같은 화면에서 모델을 누르면 하위 메뉴창이 나오게 하려면 어떻게 해야할까? 답은 다음과 같은 구조이다. box_tab 에 position: relative를 주고 현대, 모델, 세부모델 div를 box_tab 자식으로 둔다. 각각 텍스트, 메뉴창을 자식으로 줘서 관리한다. 현대 메뉴창 내용 ... 와 같은 형식이다. id="list"에 대해서는 position absolute를 줘서 box_tab을 기준으로 위치 시킨다. 이를 통해서 간단한 구조로 메뉴창 위치를 잡을 수 있다. 실제로 위 코드를 분석해보려면 엔카 사이트를 들어가보면 된다. 토글되는 방식은 자바스크립트를 이용해서 동적으로 바꿔주면 된다. 여러 방법이 있으니 javascript click toggle example로 검색해서 예제를 .. 2020. 10. 11. [Data type] Prototype 빈 Object를 만들면 아무 기능도 사용할 수 없을까? 답은 [[Prototype]]이 무엇인지에 따라 달라진다. 표준인 ECMAScript에서 객체 생성시 객체를 연결 할 수 있도록 해두었다. 연결되는 객체를 [[Prototype]]이라 한다. 크롬에서는 __proto__로 보여준다. 2020. 5. 30. CSS white-space(white-space을 처리하는 방법) html에서 가장 중요한 것은 컨텐츠를 이루는 텍스트이다. 텍스트를 작성하다 보면 space, new line , tab을 많이 사용하는데 이것을 브라우저에서 곧이 곧대로 표현해주진 않는다. space, new line, tab를 모두 white-space라고 가정하겠다. white-space: normal (default) css에서는 default로 여러개의 white-space를 하나의 space로 인식한다. 그리고 글자가 들어갈 영역에 맞춰서 개행이 이루어진다. 예를 들면 space+tab+newline을 만나면 브라우저에서는 space 하나로 처리하는 것이다. 아래 사진과 같이 영역에 맞춰서 개행이 이루어진다. 네 번째 줄에서 'ullamco~~' 다음에 띄어쓰기, 탭, 엔터를 쳤지만 띄어쓰기 .. 2020. 5. 25. HTML form, input 웹사이트를 사용하다 보면 로그인이나 회원가입도 하고 검색도 하게 된다. 아래 사진과 같이 검색하는 것도 보았을 것이다. 이런 기능을 구현할 때 form, input으로 구현한다. 위의 코드를 구현하려면 과 같은 구조를 사용하면 된다. form form 태그의 속성으로 request에 대한 목적지인 url, request 방식인 method과 같은 request에 대한 정보를 등록한다. request의 body에 들어갈 데이터는 어떻게 정의할까? 바로 input 태그를 사용하는 것이 대표적이다. 매일 우리가 로그인할 때 아이디와 비밀번호를 입력한다. 이 입력하는 과정이 input 태그에 정보를 넣는 과정이다. 그리고 로그인 버튼을 누르면 form 태그에 대한 request message가 전송되는 것이다... 2020. 5. 22. 이전 1 2 3 4 ··· 6 다음