본문 바로가기
[jQuery/Tutorial] Selector 를 통해 Element 선택하기. Selector 를 통해 Element 선택하기. [이전강좌] DOM의 Attributes 사용하기. jQuery 는 CSS3 가 제공하는 selector 대부분을 지원하고, 이외의 특별한 selector 들도 제공한다. ID 로 선택하기 $("#myID"); Class 이름으로 선택하기 $(".myClass"); Attribute 값으로 선택하기 $("a[href='newHtml.html']"); CSS 복합 selector 로 선택하기 $("#myID ul.myClass li"); Pseudo-selector $("a.external:first"); // external 이라는 class 를 가진 첫번쨰녀석$("tr:odd"); // tr 의 홀수번째 녀석들. $("#myForm:input") // .. 2013. 7. 17.
[android] jsoup library [android] jsoup library http://jsoup.org/ DOM, CSS, jquery 같은 함수들을 제공하여 HTML 을 제어할 수 있게 하는 open source library. * HTML 을 URL, file, string 으로부터 가져와 parsing 할 수 있다. * DOM traversal 이나 CSS Selector 를 이용하여 data 를 찾을 수 있다. * HTML element, attribute, text 등을 조작 가능하다. * HTML validating 에도 쓰일 수 있다. * Comment 등을 통한 cross-site scripting ( XSS ) 를 방지할 수 있다. android jsoup, android library, android open sou.. 2013. 7. 13.
[CSS] 언제 id 를 사용하고, 언제 class 를 사용해야 할까? CSS, 언제 id 를 사용하고, 언제 class 를 사용해야 할까? ID 는 그 정의 그대로 유일성을 확보해야 할 때 주로 사용된다. 디자인, 레이아웃을 위한 작업은 class 를 이용해 작업하는 것이 좋다. CLASS, css, ID, 디자인, 레이아웃, 유일성, 정의 2013. 7. 4.
[CSS] overflow property 에 대해 알아보자. CSS, overflow property 에 대해 알아보자. CSS 의 overflow 는 div 와 같이 block component 에 잘 사용되는 style option 이다.이 옵션은 태그 안에 들어가는 내용물이, 이를 담고 있는 container 의 영역을 벗어날 경우내용물(contents) 를 어떻게 처리할가를 정의하는 것이다. 예를 들어 { overflow:hidden; } 와 같이 overflow 내용을 hidden 으로 표시하면 container 를 벗어나는 내용물은 표시하지 않는다. overflow value 값 설명 visible 기본값으로 overflow 되는 값들을 container 밖에라도 그냥 다 보여준다. hidden overflow 되는 값들을 숨긴다. scroll over.. 2013. 6. 27.
[HTML] <div></div> 와 <div /> 의 차이점 와 의 차이점 필자가 html, css 관련하여, 특히 position 에 관련한 여러가지 실습 도중 이상한 현상을 발견했다. 감자 분명 세번째 div 는 position:static 인데, 두번째 div 값의 위치에 영향을 받고 있었다. 게다가 a 태그 안에 있는 녀석의 값은 absolute 이고, 그 부모는 static 이기 때문에 windows 기준으로 "감자" anchor 가 위치되어야 하는데, 이 녀석도 세번째 div 의 값에 relative 한 값으로 위치배정이 되어 있었다. CSS position 값에 대해 자세히 알고 싶으세요? 여기를 클릭 제대로 된 원인을 찾지 못하고 새로운 example 을 만들다 발견한 사실은..바로 div 태그의 close 방법에 대한 내용. 감자 단지 div 태그.. 2013. 6. 26.
[CSS] display:block 과 display:inline 의 차이점에 대해 알아보자. CSS, display:block 과 display:inline의 차이점. 자동 줄바꿈! block으로 설정된 컴퍼넌트는 자동줄바꿈 O.inline으로 설정된 컴퍼넌트는 자동줄바꿈 X. width, height, margin, padding 속성들! block으로 설정된 녀석은 width, height, margin, padding 속성 사용이 가능한 반면 inline으로 설정된 녀석은 해당 속성들을 사용하지 못한다. 대표 component 는? display:block 이 설정되는 대표적 component 는 div.display:inline 이 설정되는 대표적 component 는 span. Block, component, css, CSS3, display, display:block, display:.. 2013. 6. 20.
jQuery, CSS Selector 모음 ( Reference ) jQuery, CSS Selector 모음 ( Reference ) 출처 : w3 스쿨 Selector Example Selects * $("*") All elements #id $("#lastname") The element with id="lastname" .class $(".intro") All elements with class="intro" .class,.class $(".intro,.demo") All elements with the class "intro" or "demo" element $("p") All elements el1,el2,el3 $("h1,div,p") All , and elements :first $("p:first") The first element :last $("p:l.. 2013. 6. 16.
[CSS] position 속성에 대해 알아보자. CSS, position 속성에 대해 알아보자. CSS property 중에 position 값에 relative 라는 녀석을 만나게 되었다.이 녀석은 뭐하는 녀석일까? 궁금해하다 position 속성 자체에 대해 공부하게 되었다. position 값에 들어갈 수 있는 값은 static, absolute, relative, fixed, inherit 이다. position:static static 값은 기본값이기 때문에 position 값을 써주지 않으면, 자동으로 static position이 된다.이 static position은, 화면의 왼쪽상단부터 element 들을 배치한다.최초 element는 최좌상단에, 그리고 그 다음 element 는 그 오른쪽에 붙는데 만약 공간이 부족하다거나, bloc.. 2013. 6. 15.
[HTML] 여러해상도의 단말 모두 지원하기. HTML, 여러 해상도의 단말 모두 지원하기. 스마트폰이 나오면서 & mobile page 들이 등장하면서많은 내용을 적은 화면에 display 해야 하는 문제들이 생겨났다. mobile page 전용으로 layout 을 다시 하고, 표시하는 정보의 내용들을 depth 를 두어 나타내는 방법으로 해결하곤 했지만, 모바일 device 의 종류가 다양해지면서 이제는 여러 해상도의 단말들에서 최적화된 look 을 보여주는 issue 가 또 다시 제기되었다. 하여, 이전부터 W3C 가 권고하였듯 HTML, CSS, JavaScript 를 다른 파일로 구성하는 것이 좋고,이 방법을 따르면, HTML 이 불려지는 시점에 해상도에 따른 CSS 파일을 지정하여 불러올 수 있어 여러 해상도를 지원할 수 있다. 위와 같은.. 2013. 6. 13.
반응형

티스토리툴바