Study Output for Myself/HTML (3) 썸네일형 리스트형 [HTML]clientX, pageX, screenX, offsetX ✅pageX pageY Page가 스크롤 되어 내려거나 좌우로 움직여도 브라우저 제일 위와 제일 왼쪽을 기준으로 몇 px 떨어져 있는 지 알 수 있는 메소드 ✅clientX clientY 스크롤을 무시하고 보여지는 화면(브라우저)위에서의 마우스 위치를 보여주는 메소드 ✅offsetX offsetY 이벤트 대상(element)를 기준으로 얼마나 왼쪽, 얼마나 아래쪽에 있는지를 보여주는 메소드. element의 제일 왼쪽상단이 (0,0)으로 기준이 된다. ✅screenX screenY 컴퓨터 화면의 좌우크기. 마우스를 움직이거나, 브라우저를 줄이거나 상관없이 동일한 값을 가진다. [HTML]Emmet 입력 후 Tab눌러 줘야 함. [기본 html마크업] ! [class를 가진 div] .classname [id를 가진 div] #id [부모-자식] div > ul > li [부모-자식-형제] div > ul + ol [같은 tag를 여러개 생성] ul > li * 5 더보기 div>ul>li^ol div안에 ul 안에 li div 안에 ol ^ => 부모의 형제로 생성해줌 더보기 p{hello} 태그 안에 텍스트 넣는 것 더보기 p.class${item $}*5 각각의 p태그 안에 item1,item2...item5가 들어가고 class도 1,2,3,4,5로 설정된다. [HTML]<section> VS <article> section은 article의 하위개념. 여러 section이 모여서 article을 형성하기도 함. ✅ 처럼 block속성을 가지고 있다. 의미적으로 비슷한 태그, 내용들을 묶어 놓은 부분. 하나의 Theme을 가지고 있다. ✅ self-contained information 여러 part가 모여서 하나의 article을 만든다. 신문의 한 기사처럼 제목,내용,작성자,끝맺음등을 담고 있다. 통째로 떨어져나가도 의미가 살아있다. 이전 1 다음