hybrid app/css3 썸네일형 리스트형 [css3] +, ~ 선택자(selector) 선택자A + 선택자B : 선택자A 바로뒤에 위치하는 선택자B를 선책한다. 선택자A ~ 선택자B : 선택자A 뒤에 위치하는 선택자B를 선택한다. 더보기 [css3] box-sizing 너비를 설정할 경우 margin값과 padding값이 들어가면 같은 너비를 설정하더라도 크기가 다르게 됩니다. box1 box2 box1 box2 box-sizing이라는 프로퍼티를 사용하면 해당 엘리먼트의 패딩과 테두리가 더는 너비를 늘이지 않습니다. box1 box2 box3 box4 더보기 [css3] max-width 설정한 width값보다 브라우저 창이 작을경우 다음과 같은 현상이 발생합니다. max-width를 사용하면 설정한 넓이보다 웹의 창이 작아지면 웹 크기에에 맞춰 조절이 됩니다. 더보기 [css3] 속성값 여러개 사용할때 margin 이나 padding 속성값을 연속적으로 설정할 수 있는데 자꾸 잊어버린다. 값이 한개 : "상하좌우"값이 두개 : ''상하" "좌우"값이 세개 : "상" "좌우" "하"값이 네개 : "상" "우" "하" "좌" border-radius는border-radius : radiusborder-radius: top-left-and-bottom-right top-right-and-bottom-leftborder-radius: top-left top-right-and-bottom-left bottom-rightborder-radius: top-left top-right bottom-right bottom-left 시계방향이라고 기억하자 더보기 [css3] !important css는 순차적으로 정의되기 때문에 중복으로 정의할 경우 나중에 정의한 값이 적용이된다. 다시말하자면 div{color:red} div{color:blue} 라고 정의했다면 마지막에 정의한 blue색깔이 적용될 것이다. !important를 사용하면 처음에 적용된 값을 유지하게 해준다. div{color:red !important;} div{color:blue} 앞의 색깔이 유지되는걸 확인할 수 있다. 더보기 [css3] MediaQuries 반응형웹 반응형웹이란 웹의 크기에 맞춰 적합한 디자인을 적용시킨다. 어렵게 생각할 필요없이 크기에 따라 css적용을 다르게 해주면 된다는 말이다. css3의 미디어쿼리를 사용해 웹사이즈에따라 css를 적용시킬수 있다. 미디어쿼리의 사용방법은 다음과 같다. @media screen and (max-width: 480px) { 스타일적용 } //너비가 480이하 @media screen and (min-width: 481px) and (max-width: 1024px) { 스타일적용 } //너비가 481이상 1024이하 @media screen and (min-width: 1205px) { 스타일적용 } //너비가 1205이상 위와 같이 사이즈에 따라 스타일 적용을 다르게 하면 된다. 크기를 바꿔보세요 웹 사이즈를 .. 더보기 [css3] 유용한 css3효과 모음 http://collegegfx.com/35-useful-css3-tutorials-to-boost-your-skills/ 더보기 이전 1 2 다음
