HTML与CSS常用代码

1. =======HTML常用代码=======
   
2. ------图象和文字的对齐------
   
3. 
   
4.     <img src="URL" align="#"> #=top上, middle中, bottom下。
   
5. 
   
6. ------图象在页面中的对齐/布局-------
   
7. 
   
8.     <img src=URL align="#">#=left左，right右。这里表示文字在图片下面。<img src=URL align=left vspace=10 hspace=20>vspace与hspace表示距离。
   
9. 
   
10. ------表格 ，跨多列的表元----------
    
11. 
    
12.     <td colspan=#> #=列的数目 跨多行的表元 ：<th rowspan=#> #=行的数目。
    
13. 
    
14. -------表格的标题---------------
    
15. 
    
16.      <caption align=#>内容 </caption> #=left左, center中, right右。
    
17.      <aption valign=#>内容</caption> #=top, bottom，表示标题在表格下面。
    
18. 
    
19. --------背景音乐-------------
    
20. 
    
21.      <bgsound src="168.mid" loop="5"> #=WAV 文件的 URL。#=填数字，如果填-1，表示一直播放。
    
22. 
    
23. ---------会移动的文字------------
    
24. 
    
25. 方向：direction=#  #=left左, right右。<marquee direction=left>右向左移</marquee>，<marquee direction=right>左向右移</marquee>。
    
26. 方式: bihavior=#   #=scroll, slide, alternate。<marquee behavior=scroll>一圈一圈绕着走</marquee>，<marquee behavior=slide>只走一次就歇了</marquee>，<marquee behavior=alternate>我来回走耶</marquee>。
    
27. 带颜色背景，鼠标经过文字停住：<marquee bgcolor=aaaaee>啦啦啦，我会移动耶！</marquee>
    
28. 空白:hspace=# vspace=#  #=数字。示范：<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=center>啦啦啦，我会移动耶！</marquee>大家好！
    
29. 
    
30. 
    
31. ==========CSS常用代码===========
    
32. 
    
33. 字体颜色 : color : #00903A;
    
34. 背景颜色 : background-color : #7CFFE7;
    
35. 
    
36. --------------------------------------------------------------------------------
    
37. 
    
38. 边框宽度 : border-width : 5px;
    
39. 上边宽度 : border-top-width : 5px;
    
40. 左边宽度 : border-left-width : 5px;
    
41. 右边宽度 : border-right-width : 5px;
    
42. 底边宽度 : border-bottom-width : 5px;
    
43. 
    
44. --------------------------------------------------------------------------------
    
45. 
    
46. 边框颜色 : border-color : #000FF4;
    
47. 上边颜色 : border-top-color : #10FF01;
    
48. 左边颜色 : border-left-color : #FF3B04;
    
49. 右边颜色 : border-right-color : #FF3CF3;
    
50. 底边颜色 : border-bottom-color : #00D0C3;
    
51. 
    
52. --------------------------------------------------------------------------------
    
53. 
    
54. 边框样式 : border-style : double; 可替换 dashed; dotted; none;  
    
55. 上边样式 : border-top-style : solid;   
    
56. 左边样式 : border-left-style : inset;
    
57. 右边样式 : border-right-style : ridge;   
    
58. 底边样式 : border-bottom-style : solid;   
    
59. 
    
60. --------------------------------------------------------------------------------
    
61. 
    
62. 整体宽度 : width : 5px;  
    
63. 整体高度 : height : 5px;  
    
64. 溢出选项 : overflow : visible;  可替换 hidden; scroll; auto;
    
65. 
    
66. --------------------------------------------------------------------------------
    
67. 
    
68. 内侧边距 : padding : 5px;   
    
69. 上内边距 : padding-top : 5px;  
    
70. 左内边距 : padding-left : 5px;  
    
71. 右内边距 : padding-right : 5px;  
    
72. 底内边距 : padding-bottom : 5px;  
    
73. 
    
74. --------------------------------------------------------------------------------
    
75. 
    
76. 外侧边距 : margin : 5px;   
    
77. 上外边距 : margin-top : 5px;   
    
78. 左外边距 : margin-left : 5px;   
    
79. 右外边距 : margin-right : 5px;   
    
80. 底外边距 : margin-bottom : 5px;   
    
81. 
    
82. --------------------------------------------------------------------------------
    
83. 
    
84. 文字字体 : font-family : fantasy;   
    
85. 文字大小 : font-size : 12pt;   
    
86. 文字粗细 : font-weight : bold;
    
87.                 font-weight的值有normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
88. 文字样式 : font-style : italic;   
    
89. 文字变量 : line-height : 110%;      
    
90. 
    
91. --------------------------------------------------------------------------------
    
92. 
    
93. 清除属性 : clear : left;  可替换 right;  both;  none;
    
94. 浮动属性 : float : left;  可替换 right;  none;
    
95. 水平排列 : text-align : left; 可替换  right;  center;  justify;
    
96. 文本修饰 : text-decoration : underline;  可替换  overline;  underline overline;  line-through;  blink;
    
97. 文本缩进 : text-indent : 5em;   
    
98. 文字间距 : letter-spacing : 5px;   
    
99. 字母间距 : word-spacing : 5px;   
    
100. 文本转换 : text-transform : capitalize;  可替换  lowercase;  uppercase;  
     
101. 垂直排列 : vertical-align : baseline;    可替换  top; middle; bottom; text-top; text-bottom; super; sub; 3em; 30%;  
     
102. 
     
103. --------------------------------------------------------------------------------
     
104. 
     
105. 背景图片 : background-image : url(tianyi.gif);   
     
106. 背景拉伸 : background-repeat : repeat;   可替换   repeat-x; repeat-y; no-repeat;  
     
107. 背景定位 : background-position : left;   可替换   right; top; left top; right bottom; 30% 50%;
     
108. 附加属性 : background-attachment : fixed; 可替换  scroll;   
     
109. 
     
110. --------------------------------------------------------------------------------
     
111. 
     
112. 显示属性 : display : none; 可替换  block; inline; run-in; compact; list-item; marker;   
     
113. 是否可见 : visibility : visible; 可替换  hidden;   
     
114. 资源定位 : position : static;  可替换  relative; absolute; fixed;  
     
115. 距离顶部 : top : 5px;
     
116. 距离左边 : left : 5px;  
     
117. 距离右边 : right : 5px;   
     
118. 距离底边 : bottom : 5px;   
     
119. 优先等级 : z-index : 5;
     
120. 鼠标指针 : cursor : crosshair; 可替换  default; pointer; move; text; wait; help; n-resize; s-resize; w-resize; e-resize; ne-resize; nw-resize; se-resize; sw-resize;