본문 바로가기

CSS

백그라운드 에니메이션 더보기
html5 input type search css html5에서 input type="search" 를 할 경우 패딩이 width 에 포함되는데요.예를 들어 input 의 css 가 width:200px;padding:20px; 일 경우라 했을때일반적으로는 width + padding 값이 input 의 wdith 값이 되므로 width 값은 240이 되어야되는데input type="search" 의 경우 width + padding 값이 240이 아닌 width 설정값인 200이 되는것을 확인 할 수 있는데요.이부분을 맞추기 위한 css를 정리하였습니다.ie 계열과 파이어폭스 같은 경우엔 안그러는데 꼭.. 이 크롬만 이러네요~ 크롬 user agent stylesheet 에 삽입되는 것을 아래 보시다 싶이 box-sizing:border-box; 가 .. 더보기
Internet Explorer User Agent Style Sheets Internet Explorer User Agent Style Sheets IE6 IE7 IE8 IE9 a color: #00F;text-decoration: underline; color: #06C;text-decoration: underline; a:visited color: #800080; address display: block;font-style: italic; b font-weight: bold; bdo direction: rtl;unicode-bidi: bidi-override; blockquote display: block;margin: 14pt 30pt; display: block;margin: 1em 40px; body display: block;margin: 15px 10px;zoom.. 더보기
Mozilla Default CSS Mozilla Default CSS 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 12.. 더보기
브라우저별 Style Sheet Defaults 이제부터 브라우저 기본적으로 가지고있는 스타일 속성을 알아보려 한다.각각의 브라우저의 엘리먼트별 스타일 속성을 가지고있는지 알아보려 조사를 시작했다.1. CSS 2.1 User agent Style Sheet Defaults 녹색 구현 사이의 차이 블루 일관성있는 속성 라이트 회색 구현안됨 핑크 추가된 속성 레드 없는 속성들이 있음 오렌지 수정된 값을 보여줍니다. CSS2.1 User Agent Style Sheet Defaults ElementPropertyAppendix DIE7IE8FF2FF3OperaSafari 3.1Final Styles Addressdisplayblockblockblockblockblockblockblockblock font-styleitalicitalicitalicitalic.. 더보기
css3 ie지원적용 방법 - word-wrap (지원 브라우저 : IE6~9, FF, CR, SF, OP) : word-wrpa : break-word; - text-overflow (지원 브라우저 : IE6~9, CR, SF, OP) : text-overflow:ellipsis; : -o-text-overflow:ellipsis; - @font-face (지원 브라우저 : IE6~9, FF, CR, SF, OP) : @font-face {font-family:ngttf; src:url(NanumGothic.ttf);} : @font-face {font-family:ngeot; src:url(NanumGothic.eot);} body, input, textarea, select, button {ㅁ font-family:Nanum.. 더보기
프린트 - CSS로 제어하기 @charset "utf-8"; @media print { #skip-navigation{display:none;} #header{display:none;} #sidebar{display:none;} #content{width:100%;} #footer{display:none;} } 더보기