월: 2014 4월

DOT NAVIGATION STYLES

Dot Navigation Styles VIEW DEMO     DOWNLOAD SOURCE

더보기

Using Gradients

https://developer.apple.com/library/safari/documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Gradients/Gradient.html background: -webkit-linear-gradient(aqua, white) background: -webkit-linear-gradient(red, yellow, orange, green, blue, purple); background: -webkit-linear-gradient(left, black, white); background: -webkit-linear-gradient(bottom right, black, white); -webkit-linear-gradient(45deg, black, white) background: -webkit-linear-gradient(left,black,blue 10%,blue 90%,black); background: -webkit-linear-gradient(left,white,blue 50%,purple 50%,white);   div style=”width: 200px; height: 200px; border-radius: 50%; background: -webkit-radial-gradient(30% 30%, white, black);”        

더보기

Why The Best Time To Drink Coffee Is Not First Thing In The Morning

Why The Best Time To Drink Coffee Is Not First Thing In The Morning ( http://www.forbes.com/sites/anthonykosner/2014/01/05/why-the-best-time-to-drink-coffee-is-not-first-thing-in-the-morning/ ) Ryoko from ILoveCoffee.jp explains the science of cortisol and coffee consumption.   Drinking a cup of coffee first thing in the morning blunts the energy-boosting effects of caffeine and may lead to increased tolerance of the stimulant. This counterintuitive […]

더보기

::selection

::selection { background-color: #f16a16; color:#fff; } /* IE9+, Opera, Goolde, Chrome, Safari */ ::-moz-selection { background-color: #f16a16;  color:#fff; } /* Firfox */ Browser Support The ::selection selector is supported in IE9+, Opera, Google Chrome and Safari. Firefox supports an alternative, the ::-moz-selection.   Link1 :  https://developer.mozilla.org/en-US/docs/Web/CSS/::selection Link2 :  http://www.w3schools.com/cssref/sel_selection.asp  

더보기

Why an image inside a div has an extra space below the image?(DIV코딩시 이미지 밑에 공백이 생겼을 경우)

DIV <div class=”app_photo”> <img src=”imgs/photo_no.gif” /> <div class=”btn”><a href=”#”><span class=”s-green”>추가</span></a></div> </div> CSS .app_photo { width:166px; margin: 10px auto 20px auto; border: 5px solid #bec4d0; border-radius:30px;-webkit-border-radius:30px;-moz-border-radius:30px; } .app_photo img { width:100%; height: 146px; border-radius:25px;-webkit-border-radius:25px;-moz-border-radius:25px; } .app_photo .btn { position: absolute; margin: 0 auto; margin-top:-35px; width:155px; } .app_photo .btn a { width: 40px; height:40px; display: block; margin-left: […]

더보기

Should Tables be avoided in HTML at any cost?

http://stackoverflow.com/questions/82391/should-tables-be-avoided-in-html-at-any-cost#82402 ——- It is advisable to use tables in HTML pages (now that we have CSS)? What are the applications of tables? What features/abilities does tables have that are not in CSS? ——- I guess I’m not in the majority here, but I still see a lot of use for tables in HTML. Of course, […]

더보기

@media only screen

@media only screen and (min-width: 960px) and (max-width: 1140px) { @media only screen and (min-width: 767px) and (max-width: 960px) { @media only screen and (min-width: 480px) and (max-width: 767px) { @media only screen and (max-width: 480px) { @media only screen and (max-width: 320px) {   @media only screen and (max-width: 320px) { /* disable webkit […]

더보기

font-famliy

국내에서 자주 쓰는 폰트 font-family: 나눔고딕, ‘NanumGothic’, ‘NanumGothicWebB’, ‘맑은 고딕’, “Malgun Gothic’, 돋움, 굴림, Dotum, Gulim, sans-serif; font-size:1em;/*16px*/ letter-spacing:-1px; line-height:1.6;  

더보기

input type

모바일 키보드 키패드 input type 및 앵커 기본 키보드 <input type=”text”/> URL 키보드 <input type=”url”/> 이메일 키보드 <input type=”email”/> 숫자 키보드 <input type=”text” pattern=”[09]*”/> * 안먹힘   <input type=’number’ /> 확인요망    [ 영문 첫글자 대문자 모드 없애기 ]  <input type=”text” autocapitalize=”off” /> [ 자동완성 사용 안하기 ]  <input type=”text” autocomplete=”off” /> [ 자동 오타교정 사용 […]

더보기

Approximate Conversion from Points to Pixels

http://reeddesign.co.uk/test/points-pixels.html Approximate Conversion from Points to Pixels (and Ems and %) Points Pixels Ems Percent 6pt 8px 0.5em 50% 7pt 9px 0.55em 55% 7.5pt 10px 0.625em 62.5% 8pt 11px 0.7em 70% 9pt 12px 0.75em 75% 10pt 13px 0.8em 80% 10.5pt 14px 0.875em 87.5% 11pt 15px 0.95em 95% 12pt 16px 1em 100% 13pt 17px 1.05em 105% […]

더보기