position:fixed 固定定位

用 left top 都是相对于浏览器的。

我今天想给网页做一个固定定位的导航 偶然间发现。可以用margin 相对于父容器定位。

小伙伴们可以试试。

不用left top  用margin-left 试试

-小收获

CSS——fixed 固定定位相对于父容器的更多相关文章

  1. position之fixed固定定位、absolute绝对定位和relative相对定位

    什么是层模型? 什么是层布局模型?层布局模型就像是图像软件PhotoShop中非常流行的图层编辑功能一样,每个图层能够精确定位操作,但在网页设计领域,由于网页大小的活动性,层布局没能受到热捧.但是在网 ...

  2. 【CSS3】---层模型position之fixed固定定位、absolute绝对定位和relative相对定位

    什么是层模型? 什么是层布局模型?层布局模型就像是图像软件PhotoShop中非常流行的图层编辑功能一样,每个图层能够精确定位操作,但在网页设计领域,由于网页大小的活动性,层布局没能受到热捧.但是在网 ...

  3. 移动端底部fixed固定定位输入框ios下不兼容

    简短记录下最近开发移动端项目碰到的小坑,产品需求做一个售后对话页面,底部固定输入框,和微信对话差不多,但是在ios下,fixed失效,输入框被虚拟键盘挡住,在安卓下是正常的. 尝试过网上说的很多方法, ...

  4. position：fixed固定定位的用法

    一.position:fixed:固定定位 1.实现某个元素在可视窗口的居中位置显示 1)给自身设置宽高: 2)给自身加position:fixed: 3)用margin向左移动自身宽度的一半,向上移 ...

  5. 移动端— position: fixed;固定定位解决方案

    这里有个关键的东西叫做viewport,你经常在页面的头部里可以见到它: <meta name="viewport" content="width=device-w ...

  6. CSS的固定定位

    将元素放置在浏览器窗口的固定位置,拖拽窗口时元素位置不变. 类似语法: div{ position:fixed; top:0px; left:0px; right:0px; bottom:0px; }

  7. CSS学习笔记10 相对定位，绝对定位与固定定位

    文档流中的元素的位置由元素在 (X)HTML 中的位置决定,这就是最原始的普通流,前面讲到的浮动CSS学习笔记08 浮动可以改变元素在文档流中的位置,除了这个我们还可以通过使用CSS的position ...

  8. 理解CSS相对定位和固定定位

    × 目录 [1]相对定位 [2]固定定位 前面的话 一般地,说起定位元素是指position不为static的元素,包括relative.absolute和fixed.前面已经详细介绍过absolut ...

  9. HTML+CSS : 笔记整理(2 常规流,BFC,固定定位,z-index)

    BFC和常规流的关系是什么:常规流遵循BFC,IFC规则. 定位规则总体来说三种: 常规流,浮动,绝对定位(CSS3里面新加了一种flex) 其中常规流包括BFC,IFC等规则,块级元素一个一排地从上 ...

随机推荐

  1. Acwing198 反素数

    原题面:https://www.acwing.com/problem/content/200/ 题目大意:对于任何正整数x,其约数的个数记作g(x),例如g(1)=1.g(6)=4.如果某个正整数x满 ...

  2. .Net 笔记

    1.介绍 .net一般指.Net Framework框架.一种平台,一种技术. C#是一种编程语言,可以开发基于.net平台的应用. .Net Framework是框架是.Net平台不可缺少的一部分, ...

  3. cf 500 D. New Year Santa Network

    直接按边分,2个点在边的一边,1个在另一边,组合出来就是这个边对答案的贡献,权值换了就再重新算个数而已. #include <bits/stdc++.h> #define LL long ...

  4. bzoj 1962: 模型王子

    呵呵呵呵http://wenku.baidu.com/link?url=o0CPVzuBDLJMt0_7Qph1T7TtdFOzu7O-apIpvaWbIYMz8ZWqBneGqI8LGtLdqpuK ...

  5. BZOJ 3332

    题解:给边赋上权值,然后求最大生成树,如果不符合那就无解 证明:留坑 #include<iostream> #include<cstdio> #include<cstri ...

  6. laravel.01.一些细节

    0:参考1,参考2,参考3,参考4,参考5 1.读取项目的配置文件内容,比如app.php下的name属性,用config('app.name','default-value'); 2.读取.ENV文 ...

  7. JavaWeb高级编程(下篇)

    Java标准标签库 JSP标签语法中包含一些简写可以帮助轻松编写JSP.这些简写中第一个就是taglib指令. <%@ taglib prefix="c" uri=" ...

  8. 021-PHP常用的数值类型判断函数

    <?php //判断数组 $colors = array("red", "blue", "green"); if(is_array($ ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons)：glyphicon glyphicon-refresh

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  10. MongoDB七-运维技术

    复制来自:http://www.cnblogs.com/huangxincheng/archive/2012/03/08/2384571.html 这一篇我们以管理员的视角来看mongodb,作为一名 ...