ADOBE FIREWORKS CS5Using the CSS3 Mobile Pack             ADOBE FIREWORKS CS5
“Just do the best of things you truely believe in andalways continue to innovate as this is the only wayyou can make a dif...
ADOBE MAX 2011CSS3 . Jquery Mobile                       ADOBE FIREWORKS CS5
ADOBE FIREWORKS CS5
http://html5readiness.com/                             ADOBE FIREWORKS CS5
CSS3@font-faceborder-radiusgradientbox-shadowtext shadowRGBAOpacity                 http://developer.apple.com/safaridemos...
@FONT-FACEAllows a font file to beassociated with a font name                                          HELVETICAfor later ...
2D-TRANSFORMRotates the selected elementat the defined angle, defined                                          TRANSFORMin...
TEXT-SHADOWCreates a drop shadowbeneath the selected text                            TEXT-SHADOW                          ...
BORDER-RADIUSCurves the corners of theborder using the radius given,often in pixels. This can begiven to all corners, or o...
RGBALike RGB color definitions,but allows a fourth field,defining the alpha value of thecolor being applied.              ...
OPACITYAdjusts the opacity of theselected element’spresentation on screen.                             div { color: #f00; ...
BROWSER PREFIXESFIREFOX:   -moz-box-shadow:SAFARI:    -webkit-box-shadow:OPERA:     -o-box-shadow:  IE:      -ms-box-shado...
CSS3 Properties Panel                        ADOBE FIREWORKS CS5
The mobile web is not a 320px web                            ADOBE FIREWORKS CS5
http://www.victoriassecret.com/                                  ADOBE FIREWORKS CS5
http://mobile.victoriassecret.com/                                     ADOBE FIREWORKS CS5
Why use a Mobile Framework- provide consistent user interface components- smooth browser consistence- mimic native mobile ...
ADOBE FIREWORKS CS5
S e a rs http://m.sears.com/                      ADOBE FIREWORKS CS5
O b a m a2 0 1 2 barackobama.com/m/Mobile website forPresident BarackObama.                     ADOBE FIREWORKS CS5
M o u linR o u g e m.moulinrouge.frMobile website forthe “most famouscabaret in theworld”.                     ADOBE FIREW...
T ra v e lW is c o n s in m.travelwisconsinThe official mobileweb site of theWisconsinDepartment ofTourism isthe authority...
Jquery Mobile Theme                      ADOBE FIREWORKS CS5
One more thing...                    ADOBE FIREWORKS CS5
http://labs.adobe.com/downloads/fireworks_css3mobile.html                                          ADOBE FIREWORKS CS5
Thank YouADOBE FIREWORKS CS5
Upcoming SlideShare
Loading in …5
×

Presentation css3

1,579 views

Published on

Presentation slides on Fireworks CSS3 Mobile Pack

Published in: Design, Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,579
On SlideShare
0
From Embeds
0
Number of Embeds
31
Actions
Shares
0
Downloads
21
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Presentation css3

  1. 1. ADOBE FIREWORKS CS5Using the CSS3 Mobile Pack ADOBE FIREWORKS CS5
  2. 2. “Just do the best of things you truely believe in andalways continue to innovate as this is the only wayyou can make a difference in peoples’ life” ADOBE FIREWORKS CS5
  3. 3. ADOBE MAX 2011CSS3 . Jquery Mobile ADOBE FIREWORKS CS5
  4. 4. ADOBE FIREWORKS CS5
  5. 5. http://html5readiness.com/ ADOBE FIREWORKS CS5
  6. 6. CSS3@font-faceborder-radiusgradientbox-shadowtext shadowRGBAOpacity http://developer.apple.com/safaridemos/showcase/typography/ ADOBE FIREWORKS CS5
  7. 7. @FONT-FACEAllows a font file to beassociated with a font name HELVETICAfor later use in font-family @font-face {declarations. font-family: Helvy; src: local(”Helvetica Neue Bold”), local(”HelveticaNeue-Bold”),IE supports only .eot url(MgOpenModernaBold.ttf);Embedded OpenType files, font-weight: bold;while the other browsers } support any TTF and p.specialFont { font-family: Helvy, sans-serif; }OTF font files. ADOBE FIREWORKS CS5
  8. 8. 2D-TRANSFORMRotates the selected elementat the defined angle, defined TRANSFORMin degrees. transform: rotate(30deg); M OR N SF A TR ADOBE FIREWORKS CS5
  9. 9. TEXT-SHADOWCreates a drop shadowbeneath the selected text TEXT-SHADOW text-shadow: 5px 5px 5px #FFFF00; ADOBE FIREWORKS CS5
  10. 10. BORDER-RADIUSCurves the corners of theborder using the radius given,often in pixels. This can begiven to all corners, or only to border-radius: 15px;individual corners as specified ADOBE FIREWORKS CS5
  11. 11. RGBALike RGB color definitions,but allows a fourth field,defining the alpha value of thecolor being applied. div { color: rgb(0,255,0); } div { color: rgb(0,255,0.8); } ADOBE FIREWORKS CS5
  12. 12. OPACITYAdjusts the opacity of theselected element’spresentation on screen. div { color: #f00; opacity: 1.0; }Takes values between 0.0(fully transparent) and 1.0(fully opaque) div { color: #f00; opacity: 0.5; } ADOBE FIREWORKS CS5
  13. 13. BROWSER PREFIXESFIREFOX: -moz-box-shadow:SAFARI: -webkit-box-shadow:OPERA: -o-box-shadow: IE: -ms-box-shadow: ADOBE FIREWORKS CS5
  14. 14. CSS3 Properties Panel ADOBE FIREWORKS CS5
  15. 15. The mobile web is not a 320px web ADOBE FIREWORKS CS5
  16. 16. http://www.victoriassecret.com/ ADOBE FIREWORKS CS5
  17. 17. http://mobile.victoriassecret.com/ ADOBE FIREWORKS CS5
  18. 18. Why use a Mobile Framework- provide consistent user interface components- smooth browser consistence- mimic native mobile app experience ADOBE FIREWORKS CS5
  19. 19. ADOBE FIREWORKS CS5
  20. 20. S e a rs http://m.sears.com/ ADOBE FIREWORKS CS5
  21. 21. O b a m a2 0 1 2 barackobama.com/m/Mobile website forPresident BarackObama. ADOBE FIREWORKS CS5
  22. 22. M o u linR o u g e m.moulinrouge.frMobile website forthe “most famouscabaret in theworld”. ADOBE FIREWORKS CS5
  23. 23. T ra v e lW is c o n s in m.travelwisconsinThe official mobileweb site of theWisconsinDepartment ofTourism isthe authority forinformation to planyour next Wisconsinvacation orgetaway. ADOBE FIREWORKS CS5
  24. 24. Jquery Mobile Theme ADOBE FIREWORKS CS5
  25. 25. One more thing... ADOBE FIREWORKS CS5
  26. 26. http://labs.adobe.com/downloads/fireworks_css3mobile.html ADOBE FIREWORKS CS5
  27. 27. Thank YouADOBE FIREWORKS CS5

×