Html&css¹è®­ 舒…‹

  • View
    2.406

  • Download
    7

Embed Size (px)

DESCRIPTION

 

Text of Html&css¹è®­ 舒…‹

  • 1.

2. HTML CSS 3. DreamWeaver Vim Editplus/Notepad++ WebStrom/Aptana/Eclipse 4. HTML & CSS CSS Sprites 5. Html & 6. HTML HyperText Mark-up Language element attribute,property 7. HTML 19936 (IETF)HTML 1.0 199511RFC 1866RFC 285420006HTML 2.0HTML 3.21996114W3CHTML 4.0HTML 4.0 1997, W3CHTML 4.01 19991224XHTML 1.0 2000126XHTML 1.1 2001531HTML 5.0201*,W3C 8. Html & 9. Doctype //W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">HTML 4.01doctypeHTML5 10. title charset base 11. HTML (SEO) 12. dl > dt , dd ; ul , ol > li table > thead,tfoot ,tbody > tr > th,td h1~h6 , p 13. Oh, No! b , i , u, big , small center , menu , layer , marquee , font align , bgcolor , bgsound ,link , alink , vlink 14. label input :: 15. Html & 16. (block)div h1~h6 ul ol li dt dd dl form p () (inline)span strong em a img input button select 17. h1~h6 p dt address(X)HTML Strict http://www.junchenwu.com/2007/01/allowed_nesting_of_elements_in_html_4_strict_and_xhtml_10_strict.html 18. data- TextText

19. >->-- (as short as possible, as long as necessary.) 20. CSS Css Sprites 21. Cascading Style Sheet 22. CSS CSS CSS 1 1996.12 CSS 2 1998.5 (,,) CSS 2.1 2002() CSS3 23. CSS Linkmedia @media print{#header{border:1px solid #000}} 24. 25. Cascading 26. CSS Css Sprites 27. CSS Selector Property Value selector { property:value; } 28. CSS Selector Selector h1 .classname id #id * div p h1,h2 :hover CSS input[type=button] ie6 29. CSS Selector ABCDADD 30. CSS Prperty inheritanceText-related properties that are inheritedList-related properties that are inheritedThe color property is inherited 31. CSSborder-collapse, border-spacing, caption-side, color,cursor, direction, empty-cells, font-family, font-size,font-style, font-variant, font-weight, font, letter-spacing, line-height, list-style-image, list-style-type, list-style, orphans, pitch-range, pitch, quotes, text-align, text-indent, text-decoration, visibility,white- space, word-spacing 32. CSS Value width:auto; color:red; color:#f60; 33. CSS Value font-sizeline-height : em ,px ,% padding,margin,border-width(top, right, bottom, left) font (font-size,font-family) 34. CSS position and z-index static relative absolute fixed/ 35. CSS overflow visible () hidden () auto , scroll 36. CSS vertical-align inline-block inline th,td 37. CSS display:none visibility:hidden 38. CSS CSShttps://developer.mozilla.org/en/CSS_Reference 39. CSS hackHACK**: #test{ color:red; /* */ color:red !important;/* FirefoxIE7+ */ _color:red; /* IE6 */ *color:red; /* IE6IE7 */ *+color:red; /* IE7 */ color:red0; /* IE8 */ color:red9; /* IE6IE7IE8 IE9 */} 40. CSS Css Sprites 41. CSS Sprites 1.HTTP,2. 1+1 < 2 1./2. 42. CSS Sprites: 43. or repeat-x , repeat-y, no-repeat 44. .col-sub .hd{} .module-new .hd {} 45. SASS:CSShttp://sass-lang.com/ 46. SASS:CSS http://sass-lang.com/ 47. SASS:CSShttp://sass-lang.com/ 48. SASS:CSShttp://sass-lang.com/ 49. Zen Codinghttp://www.smashingmagazine.com/2009/11/21/zen-coding-a-new-way-to-write-html-code/ 50. & 51. 52. 53. 54. 55. + 56. 57. & + 58. Photoshop web Ctrl+Shift+C Ctrl+C CSS Sprites ctrl+;:->->, PS 59. & 60. GIF JPG PNG 61. VS VS alpha(RGBA) 62. GIF Graphics Interchange Format (LZW) 63. JPG & JPEG Joint Photographic Expert Group 64. PNG PNG is Not GIF? Portable Network Graphics 65. PNG alpha 66. PNG PNG8 PNG24 alpha PNG32 alphaPhotoshopWEBPNG32?http://www.deepbluesky.com/blog/-/the-difference-between-png24-and-png32_49/ 67. PNG PNGGAMMA Pngcrush http://pmt.sourceforge.net/pngcrush/ PngOut http://advsys.net/ken/utils.htm OptiPNGhttp://optipng.sourceforge.net 68. JPG JPG EXIF jpegtran http://jpegclub.org 69. TPS 70. https://developer.mozilla.org/cn/HTML https://developer.mozilla.org/en/CSS_Reference - Steve Souders 71.