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. CAN分帧接收实现

    该版本程序实现了上电后先发送MACID检测功能,如果网络上有应答.则一直进行死循环,直到用户更改了本机的ID地址 才可以跳出循环体. 本单片机设置为双滤波 ,使目标地址为0X1F 实现了建立连接命令 ...

  2. ActiveMQ持久化机制和JMS可靠消息

    1.ActiveMQ持久化机制 1.1 JDBC将数据持久化到数据库 1.2 AMQ生成日志文件 1.3 KahaDB:本次磁盘生成数据文件(默认) 1.4 LevelDB:谷歌K/V数据库 1.5 ...

  3. Django——include()三种使用方法

    include()的三种使用方法 1.include(module, namespace=None) 2.include(pattern_list)  最常用 3.include((pattern_l ...

  4. 在Windows中安装vim

    这篇文章主要教大家如何在Windows系统下安装最好用的编辑器VIM 来自百度百科的介绍: Vim是一个类似于Vi的著名的功能强大.高度可定制的文本编辑器,在Vi的基础上改进和增加了很多特性. VIM ...

  5. 修改element-ui里table中悬浮框中三角号的颜色及透明度设置

    .el-tooltip__popper,.el-tooltip__popper.is-dark{background:rgba(0,0,0,0.6) !important;} .el-tooltip_ ...

  6. Linux基础学习准备

    Linux 基础学习准备 工欲善其事必先利其器,还是买个服务器折腾比较好. 虚拟机和镜像 推荐吾爱的:吾爱虚拟机2.0 CentOS镜像: Centos国内下载源 http://man.linuxde ...

  7. PHP购物网站

    我使用的phpsteam经常用着用着就闪退,所以做起来挺麻烦的.里面的代码有抄袭借鉴网上的代码,就是那个php做购物网站点击量最高的那个. 但是我很多代码也是自己写的不和其相同. PHP是一门选修课, ...

  8. HDU 4662 MU Puzzle（找规律）

    题意:问是否能把MI通过以下规则转换成给定的字符串s. 1.使M之后的任何字符串加倍(即,将Mx更改为Mxx). 例如:MIU到MIUIU.2.用U替换任何III.例如:MUIIIU至MUUU.3.去 ...

  9. grep -q

    grep -q用于if逻辑判断      安静模式,不打印任何标准输出.如果有匹配的内容则立即返回状态值0. grep -q的用法 #  if  grep -q hello a.txt ; then ...

  10. 一小时搞定Eureka

    一.什么是Eureka Eureka是Netflix公司开源的产品,它是一种基于REST( Representational State Transfer )的服务,主要用于AWS云. Eureka提 ...