web——固定定位
来源:互联网 发布:云计算标准和应用大会 编辑:程序博客网 时间:2024/05/18 09:23
这个就相当于购物网站的定位效果(点击女装啊,就会定位到女装那里去)….话不多少,看代码吧!
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> p{ line-height: 50px; } #dh{ border: 1px solid #000000; width: 100%; height: 50px; background-color: #FFFFFF; position: fixed;/*固定定位*/ top: 0px; } #dh2{ border: 1px solid #000000; background-color: #FFFFFF; width: 100px; height: 300px; position: fixed; left: 300px; top: 300px; } a{ display: block; margin: 20px; } </style> </head> <body> <div id="dh2"> <a href="#nz">女装</a> <a href="#man">男装</a> <a href="#dq">电器</a> <a href="">返回顶部</a> </div> <font color="red">这里是顶部</font> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <a name="nz"></a> <font color="red">这里是女装</font> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <a name="man"></a> <font color="red">这里是男装</font> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <p>这是文本内容</p> <a name="dq"></a> <font color="red">这里是电器</font> </body></html>
阅读全文
1 0
- web——固定定位
- CSS——相对定位绝对定位固定定位
- bootstrap js插件篇——按钮、固定定位
- 码农成长记——css之固定定位
- 固定定位
- 固定定位
- 固定定位
- 固定定位
- 固定定位
- CSS定位之固定定位
- Web布局连载——两栏固定布局
- css复习——opacity(不透明度)、IE6固定定位、border-radius(圆角)
- div固定定位
- 固定定位消息框
- 弹出框固定定位
- 06_05.固定定位
- 层模型--固定定位
- 固定定位fixed
- 双向LSTM实现实现
- 事件冒泡
- [LeetCode][442. Find All Duplicates in an Array][medium]Java实现
- 判断js对象是否为一个空对象
- 自动判断访问设备
- web——固定定位
- 面试题综合
- oracle 中to_char 和to_date函数
- 机器学习笔记-集成学习之Bagging,Boosting,随机森林三者特性对比
- User defined hash in C++
- oracle用户管理
- JavaScript设计模式之-----工厂模式
- zepto.js源码解读(一):初窥全貌
- windows下hiredis使用