zoukankan      html  css  js  c++  java
  • 网页固定側栏的做法

    固定側边的做法有非常多种,今天为大家介绍一种非常简单的做法。

    整个html文档仅仅有23行代码就搞定了。

    网上也有非常多做法,可是都太过复杂。一大堆代码。并且有的非常採用一些jquery的一些插件。

    側栏的做法和顶部、页脚都大致雷同。

    掌握当中的一种,其它的都非常easy实现。常见的样例有:新浪微博的菜单条,新浪体育的右側二维码扫描等功能都是这种实现。

    这种固定特定部位,而不随滚动栏滚动的做法,见以下代码:

    <!DOCTYPE html>
    <html>
    	<head>
    		<title>測试</title>
    		<style>
    			#left{
    				position:fixed;
    				top:100px;
    				right:0px;
    			}
    			.content{
    				height:1700px;
    				border:1px solid red;
    			}
    		</style>
    	</head><!-- 欢迎大家关注我的博客!如有疑问,请加QQ群:454796847共同学习!

     --> <body> <div id="left"> <img src="1.png"/> </div> <div class="content"></div> </body> </html>

    执行效果例如以下:欢迎大家关注我的博客。如有疑问,请加QQ群:454796847共同学习! 

  • 相关阅读:
    GetEnumName 枚举名称 字符串
    拖拽文件
    小米手机Root 刷机
    微软语言 中文 英文 中英文
    MTP
    MD5加密算法全解析
    ORA-28000: the account is locked
    HTTP状态码
    HTTP 消息结构
    @RequestParam @RequestBody @PathVariable 等参数绑定注解详解
  • 原文地址:https://www.cnblogs.com/llguanli/p/8520305.html
Copyright © 2011-2022 走看看