Your SlideShare is downloading. ×
HTML/CSS로 만들어진 디테일이 살아있는 앱 제작의 노하우를 모두 공개합니다!
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

HTML/CSS로 만들어진 디테일이 살아있는 앱 제작의 노하우를 모두 공개합니다!

361
views

Published on

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
361
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. HTML/CSS WWW.NIUU.US
  • 2. 2YEARS
  • 3. <HTML> CSS{}
  • 4. OBJECTIVE-C
  • 5. S PRESSO
  • 6. <HTML>
  • 7. =PC MOBILE
  • 8. T_T
  • 9. GUIDE VER. 1
  • 10. GUIDE GUIDE GUIDE VER. 10 VER. 3 GUIDE VER. 8 GUIDE VER. 1 VER. 9 GUIDE GUIDE GUIDE VER. 12 VER. 2 VER. 11 GUIDE GUIDE GUIDE VER. 7 GUIDE VER. 6 VER. 5
  • 11. 3MONTHS
  • 12. 1-_-? 2
  • 13. -_- z Z
  • 14. LOW MEDIUM HIGH
  • 15. 240DPI 160DPI480 x 800 320 x 480
  • 16. 1.5 PX
  • 17. RETINA-_-
  • 18. RETINA NO RETINA320 x 480 640 x 960
  • 19. X_O
  • 20. b !!!!
  • 21. AMOLED
  • 22. CURSOR FINGER
  • 23. PORTRAIT LANDSCAPE
  • 24. BROWSER
  • 25. IE 6
  • 26. -_-a = -_-!!
  • 27. T_T
  • 28. T_T T_T T_T T_T T_T T_T T_T SINGLE T_T CODE T_T T_T T_TT_T T_T T_T
  • 29. S/B DESIGN HTML CSS
  • 30. 640x960 480x800RETINA 240DPI
  • 31. 2 DESIGN 2 CSS 2 IMG
  • 32. USER AGENT FILTERINGS/B DESIGN HTML CSS
  • 33. <meta name="viewport" content="user-scalable=no, width=device-width, target-densityDpi=240"> target-densityDpi = 240
  • 34. -_-+
  • 35. RETINA-_-
  • 36. 640 x 960 PIXEL x 50% = 320 x 480 SCREEN RESOLUTION
  • 37. OBJECT NO RETINA RETINA
  • 38. WHAT?
  • 39. 320 x 480 x 200% = 640 x 960
  • 40. BORDER-RADIUS : 20px FONT-SIZE : 14px BORDER : 2px LINE-HEIGHT : 20px
  • 41. 100 x 100px IMAGE SIZE.img { width:50px; height:50px; }.bg { background-size:50px 50px; }
  • 42. 100px x 50% x 200% = 100px
  • 43. 3GS
  • 44. CURSOR FINGER
  • 45. HTML<a href=”#”> <h3> </h3> <span> </span> <em> </em></a>CSSa { display:block; padding:10px; }
  • 46. <!DOCTYPE html>
  • 47. LAYOUT
  • 48. A B A B
  • 49. HTML<ul> <li> A </li> <li> B </li></ul>CSSli { float:left; width:50%; }
  • 50. 100 / 2 = 50%100 / 4 = 25%100 / 5 = 20%100 / 6 = 16.666666%
  • 51. A B A B
  • 52. HTML<ul> <li class=”a”> A </li> <li class=”b”> B </li></ul>CSS.a { position:absolute; top:0; left:0; width:100px; }.b { padding-left:100px; }
  • 53. T_T T_T T_T T_T T_T T_T T_T T_T T_T T_T T_T T_T T_T T_TT_T T_T T_T
  • 54. 1
  • 55. 2
  • 56. 3
  • 57. 4
  • 58. 5
  • 59. 6
  • 60. NIUUUSWWW.NIUU.US