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. 【转帖】Windows 10版本占比一览：v1903依然最稳定 占比52.6％

    Windows 10版本占比一览:v1903依然最稳定 占比52.6% https://os.51cto.com/art/202002/611452.htm 其实感觉现阶段的win10 与 2015年 ...

  2. UVA - 11186 Circum Triangle (几何)

    题意:有N个点,分布于一个圆心在原点的圆的边缘上,问所形成的所有三角形面积之和. 分析: 1.sin的内部实现是泰勒展开式,复杂度较高,所以需预处理. 2.求出每两点的距离以及该边所在弧所对应的圆周角 ...

  3. 指令——cd

    一个完整的指令的标准格式: Linux通用的格式——#指令主体(空格) [选项](空格) [操作对象] 一个指令可以包含多个选项,操作对象也可以是多个. 命令:#cd (change director ...

  4. web安全（xss攻击和csrf攻击）

    1.CSRF攻击: CSRF(Cross-site request forgery):跨站请求伪造. (1).攻击原理: 如上图,在B网站引诱用户访问A网站(用户之前登录过A网站,浏览器 cookie ...

  5. 实现Comparator 对List<?>进行排序

    首选需要有个Entity类 ,里面有属性有方法 package demo; public class Entity { private String empNo ; private String em ...

  6. Spark 2.x 在作业完成时却花费很长时间结束

    使用 Apache Spark 2.x 的时候可能会遇到这种现象:虽然 Spark Jobs 已经全部完成了,但是程序却还在执行.比如我们使用 Spark SQL 去执行一些 SQL,这个 SQL 在 ...

  7. C++ 99表

    #include<iostream> using namespace std; class Sumes { public: int sum; int i, j; }; int main() ...

  8. 12 文件流（Unity3D）

      关于文件操作在脚本中可以通过xml或其他的与文件相关的类中封装的一些方法可读取本地Asset文件夹下的xml文档和json文档到游戏中.但是这样操作文件难免会有拖延,C#提供了一种文件操作的方法, ...

  9. SpringBoot学习（五）——Profile

    Profile是Spring对不同环境(例如开发人用开发环境,测试人员用测试环境)提供不同配置功能的支持,可以通过激活,指定参数等方式快速切换环境 1.多profile文件形式 格式:applicat ...

  10. 每天一点点之vue框架开发 - vue坑-input 的checked渲染问题

    选中radio或者checkbox需要注意的是: 不管<input type='radio checked='true''>  你的checked属性值是true或者false,他都会选中 ...