CSS 썸네일형 리스트형 (CSS) z-index가 없는 경우의 쌓임 출처 : https://developer.mozilla.org/ko/docs/Web/CSS/Understanding_z-index/Stacking_without_z-index z-index는 잘 써야한다. 더보기 (CSS) 그라디언트 사용 예제와 사이트 그라디언트를 어느정도 마음대로 만들 수 있는 사이트는 아래에 있는 사이트입니다. http://www.colorzilla.com/gradient-editor/ 저기서 색상을 선택해서 마음대로 만들면 CSS란에 자동으로 만들어집니다. 복사하는 방법은 CSS안의 박스를 대면 COPY가 뜨는데 그걸 누르면 클립보드에 복사되어서 ctrl + v를 사용할 수 있습니다. Color format 을 rgba나 다른 것으로 변경 가능합니다. 저 소스만 가지고 붙여넣기하면 적용이 안되고 style태그를 만들고 적절한 div를 설정하여서 사용하면됩니다. 아래 예제 소스입니다. 12345678910111213141516171819/* Permalink - use to edit and share this gradient: ht.. 더보기 (CSS) animation 트랜지션 사용방법 hover 시 div 박스가 변화하는 등의 애니메이션 예제가 자세히 들어있는 사이트 입니다. 출처 : https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions 더보기 (CSS) 배경위에 텍스트가 떠있는 느낌을 표현 가능 : background-attachment:fixed background-attachment: fixed; 이걸 쓰면 됩니다. 12345678910고정된 배경이미지 예제 body { background-image: url(bg.gif); background-attachment: fixed; background-repeat: no-repeat }cs background-attachment 속성에 fixed값을 사용하여 배경이미지를 고정하면 배경위에 텍스트가 떠있는 느낌을 표현할 수 있습니다. 출처 : http://www.homejjang.com/07/background-attachment.php 더보기 (CSS) 반응형 웹 글자 크기 조절 방법 CSS로 반응형웹을 만드는데 글자도 줄일 수 있는 예제가 들어있는 사이트를 찾아봤습니다. 들어가셔서 소스보기 하면 볼 수 있습니다. http://s.codepen.io/naradesign/debug/RNGLeQ? 중요한 부분은.. 일부만 떼왔습니다. @media 부분이 중요한 것 같습니다. 12345678910111213141516171819@media (max-width:360px){html{font-size:10px;}}@media (min-width:361px) and (max-width:399px){html{font-size:11px;}}@media (min-width:400px) and (max-width:439px){html{font-size:12px;}}@media (min-width:440.. 더보기 (CSS) float:left 속성값 썼는데 이상하게 나오면? - 가상태그 float 설정을 해제 하는 방법 float:left 속성값 썼는데 이상하게 나오면? 다음 블록태그에 float속성값을 없애주어야 한다.다음 블록에 clear:both; 를 써준다. 1234567고정된 배경이미지 예제 /* 가상태그 float 설정을 해제 하는 방법 */ ul, li:after{content:'' ; display:block; clear:both}Colored by Color Scriptercs 자세한 설명은 float 을 clear하는 4가지 방법이라는.. 아래 사이트가 잘 설명되어있다. http://naradesign.net/wp/2008/05/27/144/ 더보기 이전 1 다음
