如意吧社区's Archiver

欢迎来访阿宝鼠的小天地!

天意 发表于 2008-11-26 09:27

HTML与CSS常用代码

=======HTML常用代码=======
------图象和文字的对齐------

    <img src="URL" align="#"> #=top上, middle中, bottom下。

------图象在页面中的对齐/布局-------

    <img src=URL align="#">#=left左,right右。这里表示文字在图片下面。<img src=URL align=left vspace=10 hspace=20>vspace与hspace表示距离。

------表格 ,跨多列的表元----------

    <td colspan=#> #=列的数目 跨多行的表元 :<th rowspan=#> #=行的数目。

-------表格的标题---------------

     <caption align=#>内容 </caption> #=left左, center中, right右。
     <aption valign=#>内容</caption> #=top, bottom,表示标题在表格下面。

--------背景音乐-------------

     <bgsound src="168.mid" loop="5"> #=WAV 文件的 URL。#=填数字,如果填-1,表示一直播放。

---------会移动的文字------------

方向:direction=#  #=left左, right右。<marquee direction=left>右向左移</marquee>,<marquee direction=right>左向右移</marquee>。
方式: bihavior=#   #=scroll, slide, alternate。<marquee behavior=scroll>一圈一圈绕着走</marquee>,<marquee behavior=slide>只走一次就歇了</marquee>,<marquee behavior=alternate>我来回走耶</marquee>。
带颜色背景,鼠标经过文字停住:<marquee onmouseover="stop()" onmouseout="start()" bgcolor=aaaaee>啦啦啦,我会移动耶!</marquee>
空白:hspace=# vspace=#  #=数字。示范:<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle>啦啦啦,我会移动耶!</marquee>大家好!


==========CSS常用代码===========

字体颜色 : color : #00903A;
背景颜色 : background-color : #7CFFE7;

--------------------------------------------------------------------------------

边框宽度 : border-width : 5px;
上边宽度 : border-top-width : 5px;
左边宽度 : border-left-width : 5px;
右边宽度 : border-right-width : 5px;
底边宽度 : border-bottom-width : 5px;

--------------------------------------------------------------------------------

边框颜色 : border-color : #000FF4;
上边颜色 : border-top-color : #10FF01;
左边颜色 : border-left-color : #FF3B04;
右边颜色 : border-right-color : #FF3CF3;
底边颜色 : border-bottom-color : #00D0C3;

--------------------------------------------------------------------------------

边框样式 : border-style : double; 可替换 dashed; dotted; none;  
上边样式 : border-top-style : solid;   
左边样式 : border-left-style : inset;
右边样式 : border-right-style : ridge;   
底边样式 : border-bottom-style : solid;   

--------------------------------------------------------------------------------

整体宽度 : width : 5px;  
整体高度 : height : 5px;  
溢出选项 : overflow : visible;  可替换 hidden; scroll; auto;

--------------------------------------------------------------------------------

内侧边距 : padding : 5px;   
上内边距 : padding-top : 5px;  
左内边距 : padding-left : 5px;  
右内边距 : padding-right : 5px;  
底内边距 : padding-bottom : 5px;  

--------------------------------------------------------------------------------

外侧边距 : margin : 5px;   
上外边距 : margin-top : 5px;   
左外边距 : margin-left : 5px;   
右外边距 : margin-right : 5px;   
底外边距 : margin-bottom : 5px;   

--------------------------------------------------------------------------------

文字字体 : font-family : fantasy;   
文字大小 : font-size : 12pt;   
文字粗细 : font-weight : bold;   
文字样式 : font-style : italic;   
文字变量 : line-height : 110%;      

--------------------------------------------------------------------------------

清除属性 : clear : left;  可替换 right;  both;  none;
浮动属性 : float : left;  可替换 right;  none;
水平排列 : text-align : left; 可替换  right;  center;  justify;
文本修饰 : text-decoration : underline;  可替换  overline;  underline overline;  line-through;  blink;
文本缩进 : text-indent : 5em;   
文字间距 : letter-spacing : 5px;   
字母间距 : word-spacing : 5px;   
文本转换 : text-transform : capitalize;  可替换  lowercase;  uppercase;  
垂直排列 : vertical-align : baseline;    可替换  top; middle; bottom; text-top; text-bottom; super; sub; 3em; 30%;  

--------------------------------------------------------------------------------

背景图片 : background-image : url(tianyi.gif);   
背景拉伸 : background-repeat : repeat;   可替换   repeat-x; repeat-y; no-repeat;  
背景定位 : background-position : left;   可替换   right; top; left top; right bottom; 30% 50%;
附加属性 : background-attachment : fixed; 可替换  scroll;   

--------------------------------------------------------------------------------

显示属性 : display : none; 可替换  block; inline; run-in; compact; list-item; marker;   
是否可见 : visibility : visible; 可替换  hidden;   
资源定位 : position : static;  可替换  relative; absolute; fixed;  
距离顶部 : top : 5px;
距离左边 : left : 5px;  
距离右边 : right : 5px;   
距离底边 : bottom : 5px;   
优先等级 : z-index : 5;
鼠标指针 : cursor : crosshair; 可替换  default; pointer; move; text; wait; help; n-resize; s-resize; w-resize; e-resize; ne-resize; nw-resize; se-resize; sw-resize;


==========网页简单背景音乐播放器===========[code]<BGSOUND SRC="" LOOP="-1" ID="BgSound">
        <select name="select" onChange="BgSound.src=this.value">
             <option value="" selected>↓mid音乐*^_^*与你欣赏↓</option>
             <option value="music/mid100/023.mid">爱拼才会赢</option>
             <option>*^_^*--停止播放--*^_^*</option>
</select>[/code][code]<embed name=wma src="music/mp3/ty.wma" height="1" hidden=true type=audio/mpeg loop="true" autostart="false">
<A href="javascript:document.wma.play()" target=_self title="天意 →点击播放"><FONT style="BACKGROUND-COLOR: #CD0351" color=#ffffff> PLAY </font></A> <A href="javascript:document.wma.stop()" target=_self title="关闭音乐"><font style="BACKGROUND-COLOR: #66FF66" color=#ffffff> STOP </font></A>[/code]===========在网页中固定图片=============[code]<div id="Layer1" style="position:absolute;z-index:1;left:1px;top:30px"><img src="#" width="70" height="79"></div>

<div align="center" valign="top">            
<select name='titlelink' id='titlelink' onchange="if(this.options[this.selectedIndex].value!=''){window.open(this.options[this.selectedIndex].value,'_blank');}">
                      <option selected>↓常 用 网 址↓</option>         
                      <option value='http://351329022.q-zone.qq.com'>QQ个人空间</option>
                      </select></div>[/code]

页: [1]

Copyright © www.ry168.net