13如何使用绝对定位加叠法

来源：百度文库 编辑：神马文学网 时间：2024/04/27 17:36:24
欢迎您！启步学代码。
（游子学习笔记。 供初学HTML代码的朋友参考）
 
如何使用绝对定位加叠法
要在音画贴页面的任何一位置上或同一位置上加叠文字，图片和Flash等内容，可以套用 css样式表定位属性两个属值，即绝对定位和相对定位的语句，进行加叠或叫挂贴．绝对定位的应用比较广泛，有一些技术难度，初步先选易入手的内联样式来学习．
绝对定位和相对定位的语句：
style="LEFT: 0px; WIDTH: 940px; POSITION: absolute; TOP: 20px"
style="LEFT: 0px; WIDTH: 940px; POSITION: relative; TOP: 20px"
◆style=内联css样式标记．
◆LEFT: 0px距离左边水平启点数，值越大越靠右侧。
◆LEFT: 0px也可设为RIGHT: 320px距离右边水平启点数．
◆WIDTH: 940px宽度．
◆POSITION　标记属性名称：定位．
◆absolute　定位的属值：绝对定位．
◆relative　定位的属值：相对定位．
◆TOP: 20px　距离顶部垂直启点，值越大越靠下部。
 
绝对定位加叠法示例代码(1)
显示结果： 　 101
1
分析：
图片的显示位置没有在本图框内，而是在本页的右上角．原因是绝对定位必须有参照条件，作为启始基准点，特别是垂直启点．增设相对定位代码，就可解决这个问题．本代码垂直启点TOPP: 20px，系统默认页面顶部作为垂直启始基准点．
 
绝对定位加叠法示例代码(２)
◆示例代码(2)仅是将示例代码(1)的水平和垂直启始点修改一下．
◆示例代码(1)的水平和垂直启始点：LEFT: 780px;TOP: 20px．
◆示例代码(1)的水平和垂直启始点：LEFT: 410px;TOP: 2100px．
◆垂直启始点参数TOP: 2100px，是根据本对象所在位置进行调整出来的．
◆示例代码(2)是作为学习对照参考，不可单独使用．
显示结果： 　 102
1
分析：
图片虽然是在本图框内显示，但上面的内容稍有变动，或访问者使用不同分辨率，就会出现错位．所以绝对定位加叠，必须结合相对定位容框内使用．
 
相对定位与绝对定位加叠法示例
图片加叠图片代码：
显示结果：



 
相片加叠相框代码：
◆
套用绝对定位语句的贴像片标签．
◆

 
用绝对定位挂贴Flash
示例代码（１）：
显示结果：
',1)">',2)">
 
用绝对定位编辑竖排文字示例 　　编辑竖排文字有用软件，也有各种特效代码，做法有些困难．这里试用绝对定位挂贴的方法，效果很好，提供大参考．
示例代码（１）：
显示结果：
毛主席诗词
︻
答李淑一
︼
我失骄杨君失柳，
杨柳轻扬直上重霄九。
问讯吴刚何所有，
吴刚捧出桂花酒。
寞嫦娥舒广袖，
万里长空且为忠魂舞。
忽报人间曾伏虎，
泪飞顿作倾盆雨。
 
 
示例代码（２）：
显示结果：
毛主席诗词
︻
答李淑一
︼
我失骄杨君失柳，
杨柳轻扬直上重霄九。
问讯吴刚何所有，
吴刚捧出桂花酒。
寞嫦娥舒广袖，
万里长空且为忠魂舞。
忽报人间曾伏虎，
泪飞顿作倾盆雨。
 
 
示例代码（３）：
显示结果：
毛主席诗词欣赏
︻
答李淑一
︼
我失骄杨君失柳，
杨柳轻扬直上重霄九。
问讯吴刚何所有，
吴刚捧出桂花酒。
寞嫦娥舒广袖，
忽报人间曾伏虎，
泪飞顿作倾盆雨。
 
◇ 击点打开html代码浏览器◇
原创编辑：游子
2005年10月试编 2006年06月改编
2007年04月改编 2008年11月改编
（为了让更多网友学用html代码制作音画贴，本贴欢迎转载．但是．我用了很多时间和精力编写这些资料的，转载时请注意网络上的荣辱公德不要把原创编辑游子的名字改掉。谢谢！）
13如何使用绝对定位加叠法 如何使用谷歌地球卫星定位 绝对定位代码 绝对定位代码 代码绝对定位 绝对定位表格特效代码 层绝对定位和相对定位 css中的绝对定位和相对定位 支招装修 如何对装修进行定位和合理使用预算--焦点装修家居网 支招装修 如何对装修进行定位和合理使用预算 关于博客的绝对定位 博客装饰之绝对定位 关于博客的绝对定位 博客装饰之绝对定位 明星片酬如何定位 如何定位最佳买点 如何定位透明动画 中职生如何定位 中职生如何定位 如何定位透明flash 网页布局教程:绝对定位和相对定位 css教程之绝对定位与相对定位详解 网页布局教程:绝对定位和相对定位 - 建站学 (网页设计教程)深入浅出理解绝对定位和相对定位